0

だから私はこのようなことをしようとしています: http://prothemeus.com/demo/litho/

私は遭遇しました： http://masonry.desandro.com/、http://isotope.metafizzy.co/、http://packery.metafizzy.co/それらはすべて本当に似ていますが、それらのどれも提供していません上のウェブサイトのようにスケーリングします。これらのプラグインのいずれかを使用してそのようなものを作成するにはどうすればよいですか、またはデフォルトでコンテナに合わせてスケーリングするオプションを提供するものを誰かが知っていますか?

デモを見る限り、アイソトープがレイアウトを処理していることはわかりましたが、実際のスケーリングを行うコードを追跡することはできませんでした。

どんな助けでも大いに感謝します。

4

2 に答える 2

0

Masonry はbindResizeメソッドを使用してこれをサポートしています: http://masonry.desandro.com/methods.html#bindresize

$container.masonry(options);
$container.masonry('bindResize')

これにより、サイズ変更時にレイアウトがトリガーされます。あなたもできる

$(window).resize(function () {
   $container.masonry();
});

これにより再レイアウトがトリガーされますが、頻繁に呼び出されないように調整する必要があります。これは、デフォルトでコンテナーに合わせてスケーリングされます。

次に行う必要があるのは、ウィンドウ サイズに応じてサイズが変更されるように、コンテナーをレスポンシブにすることです。そのためには、ブートストラップを調べるか、独自にロールすることができます。

于 2014-04-10T18:28:02.447 に答える