在追加內容之前延遲加載圖像

我使用window.scroll函數在滾動到頁尾時添加新內容。同時，加載旋轉圖像出現在中心，但很難察覺。我想要完成的是，當我滾動到頁面底部時，加載圖像微調器應該首先出現在最後一個內容的末尾，並延遲10secs，然後才能在隱藏之前緩慢追加（淡入淡出）新內容。在追加內容之前延遲加載圖像

$(window).scroll(function() { 
    if ($(window).scrollTop() == $(document).height() - $(window).height()) { 
     $('#loader').delay(1000).show(0); 
    $.getJSON("http://howtodeployit.com/?json=recentstories", function(data) { 

    //Set variable for currentPostcount, desiredPosts 

    newposts = data.posts.slice(currentPostcount, currentPostcount + desiredPosts); 
    $.each(newposts, function(key, val) { 
     //Append new contents 
     $("#postlist").listview().listview('refresh'); 
     $('#loader').hide(); 
     }); 
    }); 
}});

來源

2013-11-02 Chelseawillrecover

我認爲這也減緩或延遲的內容追加好辦法，而不僅僅是.fadeIn()然後.fadeOut()裝載機。

$(window).scroll(function() { 
    if ($(window).scrollTop() == $(document).height() - $(window).height()) { 
     $('#loader').fadeIn(2000); 
     $.getJSON("http://howtodeployit.com/?json=recentstories", function(data) { 

     newposts = data.posts.slice(currentPostcount, currentPostcount + desiredPosts); 

     setTimeout(function(){ 
      $.each(newposts, function(key, val) { 
       //Append new contents 
       $("#postlist").listview().listview('refresh'); 
      }); 
     },2000); 

     $('#loader').fadeOut(2000); 
     }); 

    } 
});

來源

2013-11-02 08:28:52

完美的，這也有訣竅，甚至很多更好。 – Chelseawillrecover

你可以試試這個

$('#loader').fadein(10000);

這樣的事情應該做的工作

$(window).scroll(function() { 
    if ($(window).scrollTop() == $(document).height() - $(window).height()) { 
     $('#loader').fadeIn(5000); 
    $.getJSON("http://howtodeployit.com/?json=recentstories", function(data) { 

    //Set variable for currentPostcount, desiredPosts 

    newposts = data.posts.slice(currentPostcount, currentPostcount + desiredPosts); 
    $.each(newposts, function(key, val) { 
     //Append new contents 
     $("#postlist").listview().listview('refresh'); 
     }); 
     $('#loader').fadeOut(5000); 
    }); 
}});

來源

2013-11-02 06:59:58 user2898514

NOP，遺漏的類型錯誤：你可以通過把你的追加上setTimeout()這麼做對象的翻譯：有沒有方法「淡入」 – Chelseawillrecover

是否使用jqeury用它呢？ – user2898514

請更具體一些。如果是的話，你是指JQuery JS v1.9.1是 – Chelseawillrecover

嘗試：

$('#loader').fadeIn(1000);

請注意，這是fadeIn（區分大小寫）

或者使用結束$('#loader').show();和fadeOut（根據您的需要）：

$(window).scroll(function() { 
    if ($(window).scrollTop() == $(document).height() - $(window).height()) { 
     $('#loader').show(); 
    $.getJSON("http://howtodeployit.com/?json=recentstories", function(data) { 

    //Set variable for currentPostcount, desiredPosts 
    newposts = data.posts.slice(currentPostcount, currentPostcount + desiredPosts); 
    $.each(newposts, function(key, val) { 
     //Append new contents 
     $("#postlist").listview().listview('refresh'); 

     }); 
     $('#loader').fadeOut(1000); 
    }); 
}});

來源

2013-11-02 07:17:17

在追加內容之前延遲加載圖像

回答

相關問題