javascript - 1つの変更：画像が読み込まれる前に要素を読み込む

Question

にある画像を読み込んだ後に要素を読み込むスクリプトがあります。最初に画像よりも要素を読み込みたいと思います。誰かが私を助けることができますか？

脚本：

jQuery.ias({
    container : '#con',
    item: '.bo',
    pagination: '.pages',
    next: '.next',
    loader: '<img src="loader.gif">',
    onLoadItems: function(items) {
        // hide new items while they are loading
        var $newElems = $(items).show().css({ opacity: 0 });
        // ensure that images load before adding to masonry layout
        $newElems.imagesLoaded(function(){
            // show elems now they're ready
            $newElems.animate({ opacity: 1 });
            $('#con').masonry( 'appended', $newElems, true );
        });
        return true;
    }
});

Answer 1

ロード中に非表示にする画像にクラスを追加します。

body に要素をロードし、画像をロードします。

<img src="image.jpg" クラス="プリロード" />

jQuery(document).ready(function(){
  jQuery(".preload").hide();
  // use :   jQuery(".preload").css("opacity","0");  to preserve the image place!
  jQuery(".preload").load(function(){ 
      jQuery(this).show();
      // Or jQuery(this).css("opacity","1");
  })
});