1

我正在使用 Masonry 进行布局。当浏览器的窗口调整大小时，我想在 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然后半手动触发调整大小，同时保持智能调整大小事件。

是否可以设置“智能调整大小”事件来调用函数，例如resizeLayout？

function resizeLayout(event) {
    //do precalculations

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

我缺少的是如何设置 resize 事件，使其不会被不断触发，而是以与 Masonry 相同的方式完成 when isResizableis true。

4

2 回答 2

1

我可以这样设置事件：

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

但这失去了 Masonry 的优化，其中只有在容器中适合的列数发生变化时才会重新排列砖块。如果相反我使用

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

我最终使用了一个没有记录的内部函数。

于 2011-12-22T17:42:25.660 回答
0

Masonry 可以选择将/unbind 绑定到 resize 事件。

我遇到了同样的问题，但是通过将 masonry 'unbound' 初始化为 resize 事件来修复它，然后编写一个 resize 函数，该函数以相同的方式调用 masonry，但在我想要首先执行的代码之后。

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

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