为什么我的缩略图被压扁了？同位素

Question

我正在为我的缩略图库使用 Isotope。在我构建它时，一切都很好。但是在我将它发布到我的 ftp 之后，缩略图开始垂直挤压。每次刷新时都会出现不同的缩略图。有人知道它为什么这样做吗？

http://thecarlossanchez.com/Galleries/stills.html

Answer 1

首先是加载 jQuery 2x 和 2 个不同的版本。选择最新版本并仅加载一个。其次，您正在加载 imagesloaded.js，但没有将其称为同位素。拇指被压扁是因为未加载的图像会脱离同位素布局并导致项目元素重叠，这就是您需要加载图像的原因。

试试这个：

var $grid = $('.grid').imagesLoaded( function() {
$grid.isotope({
itemSelector: '.element-item',
layoutMode: 'masonry'
});
});