同位素画廊并不总是正常工作

Question

我正在研究同位素画廊，有时它不能正常工作，我需要刷新页面几次，因为我对前端进行了一些更改，我看到每次刷新时组合都有所不同。< / p>

编辑：仅在Chrome上执行此操作。

这是它应该如何运作的：

但有时它会做这样的事情：

这是网站的the link，这是我的同位素图库代码：

我遗漏了一些项目，因为我发现我在画廊放了多少物品无关紧要。

<!-- section works -->
    <section id="section-works" class="section appear clearfix">
        <div class="container">
            <div class="row">
                <nav id="filter" class="col-md-12 text-center">
                    <ul>
                        <li><a href="#" class="current btn-theme btn-small" data-filter="*">Alles</a></li>
                        <li><a href="#"  class="btn-theme btn-small" data-filter=".photo" >Foto's</a>    </li>
                        <li><a href="#"  class="btn-theme btn-small" data-filter=".video">Video's</a>    </li>
                    </ul>
                </nav>
                <div class="col-md-12">
                    <div class="row">
                        <div class="portfolio-items isotopeWrapper clearfix" id="3">

                            <article class="col-md-4 isotopeItem photo">
                                <div class="portfolio-item">
                                    <img src="img/portfolio/img1.jpg" alt="" />
                                    <div class="portfolio-desc align-center">
                                        <div class="folio-info">
                                            <h5><a href="#">Portfolio name</a></h5>
                                            <a href="img/portfolio/img1.jpg" class="fancybox"><i class="fa fa-expand fa-2x"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </article>

                            <article class="col-md-4 isotopeItem video">
                                <div class="portfolio-item">
                                    <img src="img/portfolio/img6.jpg" alt="" />
                                    <div class="portfolio-desc align-center">
                                        <div class="folio-info">
                                            <h5><a href="#">Portfolio name</a></h5>
                                            <a class="fancybox" href="js/jwPlayer5/player.swf?    file=http://localhost/plusbus/img/portfolio/videos/files/vid1.mp4"     type="video/mp4" title="local video mp4"><i class="fa fa-expand fa-2x"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </article>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

Answer 1

没有代码，这是一个猜测。您使用的是同位素v1.56，而不是v2，需要使用Isoptope v1 imagesloaded info。

这是您使用它的方式：

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

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

对于同位素v2，您需要单独加载imagesloaded.js，因为它不包含在v1.5中