5

このサイトに石積みのレイアウトを使用し、最初のロード時に各ボックスが重なります。ナビゲーション項目のいずれかを使用して並べ替えたり、単に「すべて」のままにしたりすると、それらは自動的に再配置されます。何か案は？

4

1 に答える 1

2

私はまだ評判が 50 に達していないのでコメントできませんが、このプラグインを何度も使用して他の人の助けになる可能性があるので、過去に偶然見つけたいくつかのヒントを共有したいと思います。

まず、Sarah が述べたように、onload ではなく imageLoaded 関数を使用します。( https://github.com/desandro/imagesloaded )

ヒント 1 - isotope プラグインの動作を高速化するには (画像サイズが大きい場合や画像が多い場合に役立ちます)、各コンテナーのプレースホルダー画像を読み込みます。プラグインはすぐに動作します。次に、実際の画像を、実際の src url を含む data- 属性と交換できます。同位体コールバック ( http://isotope.metafizzy.co/events.html ) を使用するだけです。唯一の注意点は、画像がプレースホルダーと同じサイズである必要があることです。そうしないと、コンテナーのサイズが台無しになり、再び重なる可能性があります。

ヒント 2 - 実際にこれを行ったことはありませんが、使用を考えていた方法の 1 つは、画像をコンテナーの背景画像として読み込み、高さを設定し、コンテナー (または少なくともその画像部分) に対して設定することでした。 background-size: cover としての画像。同位体プラグインが機能する前に、画像の読み込みについて心配する必要はありません。

于 2014-08-29T13:43:34.593 に答える