0

Masonry http://masonry.desandro.com/ JS を適用して画像を互いに浮かせようとしましたが、うまくいかないようです。

私は次の関数を使用しました - 私は何を間違えましたか? CSSの問題かも？

<script>
  $(function(){

    $('.cycler-wrap').masonry({
      itemSelector: '.cycler-container',
      columnWidth: 100
    });

  });
</script>

以下のケルビンの回答に従ってサイトを更新しました。今はサイクルの問題です:(

4

1 に答える 1

0

ここでの問題は、要素が絶対的に配置されている.cycle-containerため、要素の高さが 0 ピクセルであることです。これにより、img要素はドキュメントの流れから外れます。

代わりに.cycler img要素を作成すると、石積みは期待どおりに機能するはずです。position:relative画像はdisplay:inlineであるため、サイクラーを機能させ続けるには、実際には最初の画像を作成するだけで済みますposition:relative。

.cycler img{
    position: absolute;
    top:0;
    left:0;
}

.cycler img:first-child{
    position:relative;
}

もちろん、すべてのブラウザー:first-childが.first.

于 2012-11-08T03:27:47.717 に答える