同位素图像重叠
同位素图像重叠
提问于 2016-02-17 19:21:48
我对Isotope有意见。我将它用于可过滤的图库，但有时(不是所有时间)，一些图像会重叠。
http://www.rivka-photography.com/work/
并不是每次都会发生这种情况，您可能需要刷新页面才能看到问题。到目前为止，我只在Mac上的Safari (最新版本)中看到了它。我正在使用imagesLoaded，但它似乎还不够。我尝试了渐进式布局和等待所有图像加载。这是我当前的JS代码：
jQuery(document).ready(function ($) {
var $grid = $('.gallery-isotope').isotope({
itemSelector: '.gallery-item',
layoutMode: 'masonry'
});
$grid.imagesLoaded().progress(function() {
$grid.isotope('layout');
});
});顺便说一句，这是一个Wordpress网站。感谢任何能帮上忙的人。
回答 3
Stack Overflow用户
发布于 2016-02-18 05:25:18
您是否尝试过他们建议的备用设置(http://isotope.metafizzy.co/layout.html#imagesloaded)：
var $grid = $('.gallery-isotope').imagesLoaded( function() {
// init Isotope after all images have loaded
$grid.isotope({
itemSelector: '.gallery-item',
layoutMode: 'masonry'
});
});Stack Overflow用户
发布于 2016-02-22 18:32:11
所以我想我想通了。我很确定问题来自Wordpress新的响应式图像大小功能(在4.4中引入)。我修改了图库代码以获得对输出图像大小的控制，现在它可以工作了。
Stack Overflow用户
发布于 2016-02-18 03:15:16
尝试使用setTimeout()。
jQuery(document).ready(function ($) {
var $grid = $('.gallery-isotope').isotope({
itemSelector: '.gallery-item',
layoutMode: 'masonry'
});
$grid.imagesLoaded().progress(function() {
setTimeout(function(){
$grid.isotope('layout');
},200);
});
});
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/35455262
复制相关文章
相似问题
腾讯云开发者
