Isotope jquery插件在Chrome上无法正常显示 [英] Isotope jquery plugin doesn't show properly on chrome

问题描述

我成功植入Isotope jquery插件，但由于某种原因，当页面第一次加载时，显示所有项目的问题只显示在Chrome上。

请参阅此处的内容 http://dl.dropbox.com/u/15358757/sd.jpg ，元素在彼此的顶部。但是当我按下PSD，然后回到所有它显示正确。

我没有默认高度的容器，因为我想要动态。 / p>

任何想法如何解决这个问题？

解决方案

可能是同位素在图像加载之前正在做它的事情。

http://isotope.metafizzy.co/demos/images.html

[在此演示]同位素触发后所有图片都加载了imagesLoaded
插件。

http://isotope.metafizzy.co/docs/help.html#imagesloaded_plugin

  var $ container = $（'＃container'）; 
 
 $ container.imagesLoaded（function（）{
 $ container.isotope（{
 // options ... 
}）; 
}） ; 
  

I implanted Isotope jquery plugin successfully but for some reason I get problem showing all the items when the page is loaded first time and it's only on Chrome.

You can see here what is happening http://dl.dropbox.com/u/15358757/sd.jpg, that elements are on top of each other. but when I press on PSDs and then back to All it shows properly.

I don't have a default height for the container because I want to to be dynamic.

Any idea how I can fix this?

解决方案

The problem is probably that Isotope is doing its thing before the images are loaded.

http://isotope.metafizzy.co/demos/images.html

[In this demo] Isotope is triggered after all images are loaded with the imagesLoaded plugin.

http://isotope.metafizzy.co/docs/help.html#imagesloaded_plugin

var $container = $('#container');

$container.imagesLoaded(function() {
  $container.isotope({
    // options...
  });
});

这篇关于Isotope jquery插件在Chrome上无法正常显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！