6

jQuery Isotope を使用して水平レイアウトを作成し、DIV を 100% の高さで並べて配置し、各 DIV 内の画像を垂直方向に中央揃えにしています。だから、私はこのようにIsotopeを呼び出しており、すべてがChromeで（ローカルで）正常に動作します：

$(function(){
    var $container = $('#container');
    $container.isotope({
        itemSelector : '.itemwrap',
        layoutMode: 'horizontal',
        horizontal: {
            verticalAlignment: 0.5
        }
    });
});

画像の読み込みに時間がかかるため、Isotope のレイアウトが台無しになる傾向があるため、imagesLoaded 修正を使用しようとしています: http://isotope.metafizzy.co/appendix.html

この修正を次のように実装しました。

$(function(){
    var $container = $('#container');
    $container.imagesLoaded( function(){
        $container.isotope({
            itemSelector : '.itemwrap',
            layoutMode: 'horizontal',
            horizontal: {
                verticalAlignment: 0.5
            }
        });
    });
});

この imagesLoaded を使用すると、Isotope はまったく読み込まれなくなります。imagesLoaded を削除すると、Isotope が再び機能します (ただし、レイアウトがめちゃくちゃになります)。間違いがどこにあるのか、誰か知っていますか？

ありがとう！

4

2 に答える 2

0

私も最近同じ問題に遭遇し、これが非同期呼び出しによるものであることを発見しました。画像が読み込ま$container.imagesLoaded()れたプラグインが読み込まれる前に、関数が呼び出されます。

jquery スクリプト行にラップ$container.imagesLoaded()して attr$(document).ready()を削除するだけです。asyn

于 2015-10-19T10:28:01.993 に答える