一項更改：加載圖像之前加載元素

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

向要隱藏的圖像添加類：

將元素加載到身體上，加載圖像：

<img src =“ image.jpg” class =“ preload” />

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");
  })
});