1

レイアウトには石積みを使用しています。ブラウザのウィンドウのサイズが変更されたら、Masonryがレイアウトをやり直す前に、いくつかの計算を実行したいと思います。

これまで、jquery.masonry.jsファイルを変更し、オプションにコールバック関数を追加することでこれを行うことができました。しかし、石積みのコードを変更せずにそれを実行したいと思います。

追加されたオプションは次のとおりです（石積みの初期化）：

$container.masonry({
    itemSelector  : '.grid-element'
    , preResizeCallback : doPreResize
    , isResizable : true
});

そして、doPreResize私がしなければならないことは何でもします。.jsファイルの変更は、次のresize関数に含まれています（バージョンv2.0.110927の293行目付近）。

resize : function() {
  //added callback to be called before doing resizing-related code
  if (this.options.preResizeCallback)
  {
      this.options.preResizeCallback(this.element);
  }
  //rest of code

私がやりたいのは、isResizableオプションをに設定してMasonryを初期化falseし、スマートサイズ変更イベントを維持しながら、半手動でサイズ変更をトリガーすることです。

「smartresize」イベントを設定して、次のような関数を呼び出すことはできresizeLayoutますか？

function resizeLayout(event) {
    //do precalculations

    //tell masonry to reorganize layout
    $container.masonry();
}

私が見逃しているのは、サイズ変更イベントが常にトリガーされないように設定する方法ですが、代わりに、がである場合にMasonryが行うのと同じ方法で実行されisResizableますtrue。

4

2 に答える 2

1

次のようにイベントを設定できます。

jQuery(window).bind( 'smartresize.masonry', function(){
    $container.masonry();
});

しかし、それは、コンテナに収まる列の数が変更された場合にのみレンガが再配置されるという組積造の最適化を失います。代わりに使用する場合

jQuery(window).bind( 'smartresize.masonry', function(){
    $container.masonry("resize");
});

文書化されていない内部関数を使用することになります。

于 2011-12-22T17:42:25.660 に答える
0

組積造には、サイズ変更イベントにバインド/バインド解除するオプションがあります。

同じ問題が発生しましたが、masonry'unbound'をresizeイベントに初期化し、同じ方法でmasonryを呼び出すサイズ変更関数を作成することで修正しましたが、コードの後に​​最初に実行しました。

$container.masonry({
    isResizeBound: false
});

$(window).bind('resize', function() {
    someFunction();
    $continer.masonry({
        isResizeBound: false
    });
});
于 2014-01-31T22:22:11.010 に答える