我在这里有一个非常奇怪的问题：[推荐链接被删除].第一行商品与第二行中的项目重叠.
砌石物品位于页脚上方的主页下方.你可以看到,它看起来与Chrome不同.在firefox,它看起来不错.
以下是我的Chrome：http://clip2net.com/s/5LIRko的外观
我的jQuery代码是：
jQuery(function($){
var $container = $('.woocommerce ul.products');
$container.masonry({
columnWidth:10,gutterWidth: 15,itemSelector: '.product-category'
});
});
有没有影响行输出的css规则？
解决方法
问题是你的图像.当石工被调用的时候,你的图像没有加载.所以它假设你的元素的高度没有考虑图像的高度.
如果在图像已被缓存后刷新屏幕,您将看到它正确加载.如果您清除缓存和刷新,您将看到它们重新重叠.
四五选项：
>等待图像加载完毕(有些插件可以等待,直到某个div的所有图像被加载为例)>等待加载事件而不是ready事件.而不是使用jQuery(function($){use jQuery(window).on(‘load’,function(){var $= jQuery;你会看到结果.>图像加载后重新应用砖石(不喜欢这个…你会看到闪烁)>我最喜欢的,不要在这里使用砖石！在您的页面上禁用JS,并查看布局.这是你想要的所有的div都是均匀的高度,甚至是宽度.在这里没有理由使用砖石.只是浮动你的元素,让他们自然地在网格中显示.>编辑：另一个选项.指定div的高度,以便高度不依赖于它加载的图像.
