Question

我通过<li>在页面上加载了几个.ajax()元素，并将它们叠加在一起。然后用户可以

拖动个别元素
点击“桩”重建堆栈
点击“展开”，使用jquery.masonry()

问题出现在最后一个选项中：当展开项目时，元素按照应有的方式进入网格中的指定位置，然后闪烁一会儿回到原始位置。

在此处观看视频：Video（Quicktime .mov）
在此处观看现场演示：Live Demo

问题只发生在大约50％的时间，而不是每次我分散物品。例如，在上面的视频中，它只发生在我点击“传播”的第二次和最后一次。我无法确定究竟是什么原因导致错误发生。在Mac上的Chrome 29.0.1547.57中会出现此问题。 Firefox 22和Safari 6.0.5不受影响。我还没有尝试过任何其他浏览器。

单击展开链接时，会以这种方式调用.masonry（）：

    $('.content').masonry({
        columnWidth: 180,
        gutter: 20,
        itemSelector: 'li',
        isResizeBound: false,
        isLayoutInstant: false
    });

我很感谢有关如何解决这个问题的提示。

更新：我注意到问题也发生在使用jquery.masonry的其他网站上，例如插件的网站本身。观看视频：Video。其他人有同样的问题，还是我的设置（OS X 10.7.5，Chrome 29.0.1547.57）？

Answer 1

我有同样的问题。这是由grid-item风格的CSS转换引起的。 删除特定DOM元素的CSS3过渡解决了我的问题。

Answer 2

我在搜索同样的问题时发现了这个问题。我开始怀疑它是我的显示器还是电缆。

我使用的是Windows 8和Chrome版本30.0.1599.101 m

jQuery和masonry（）：在Chrome中闪烁的动画对象

2 个答案: