jquery - 同位素元素仅在页面刷新时刷新

标签 jquery responsive-design jquery-isotope

我正在尝试使用 jquery 同位素来重新排列投资组合。

我希望网站具有响应能力,因此我将容器中的元素设置为 22% 宽。

但是,当我第一次加载页面时,一切看起来都很好。或者刷新一下。但是,如果我调整页面大小,元素宽度会发生很好的变化,但它们之间有很大的间隙。

在 iPad 上测试纵向和横向之间的烘焙时,也会发生同样的情况。

为什么在页面刷新之前它们不会自动移动到新位置?这是一个例子。我正在谈论的部分是“特色”框。

Http://www.comeinside.co.uk

最佳答案

从未使用过这个插件,但经过一番谷歌搜索后,看起来他的演示满足了您的要求: http://isotope.metafizzy.co/demos/fluid-responsive.html

// update columnWidth on window resize
$(window).smartresize(function(){
  $container.isotope({
    // update columnWidth to a percentage of container width
    masonry: { columnWidth: $container.width() / 5 }
  });
});

关于jquery - 同位素元素仅在页面刷新时刷新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12920972/

相关文章:

css - 随着屏幕尺寸的调整,响应式图像不会随 Firefox 一起缩放。在其他浏览器中工作

html - 具有未知图像尺寸的响应式宝丽来图像

javascript 函数在 Firefox 中不起作用

css - 手机版没有出现在iphone上

responsive-design - 同位素和媒体查询

javascript - 与演示相比,同位素砌体产生不同的输出

jquery - 过滤同位素网格后重新应用 jquery-match-height

c# - 注销后如何防止浏览器后退按钮?

javascript - bootstrap popover 在 jquery 加载函数中不起作用

Javascript 替换输入上的按键