這個網站上的加載腳本是如何實現的？

我發現這個美妙的網站有一個頁面頂部的加載欄。加載欄就像瀏覽器的加載欄，但我覺得它非常漂亮，並且希望在我的頁面中實現它。這個網站上的加載腳本是如何實現的？

2009-02-28 Raymond G.

編輯：我的答案是錯的，我回答時考慮不同的上下文。但是，我要離開它，因爲當您需要顯示加載/進度欄時，該信息可能非常有用。

他正在使用：http://www.filamentgroup.com/lab/update_automatically_preload_images_from_css_with_jquery/。

但是，他沒有使用其全部功能（請在上面的URL中查看演示）。加載欄只是一個動畫gif文件。我想你可以在http://ajaxload.info。

希望有所幫助。 :)

來源

2009-02-28 14:38:07 Favio

他是用jQuery的ajaxStart和ajaxStop

$("#loading").ajaxStart(function(){ 
    $(this).show(); 
}); 
$("#loading").ajaxStop(function(){ 
    $(this).hide(); 
});

基本上，這讓他顯示此圖像加載，而任何異步調用正在取得進展。

來源

2009-02-28 14:40:03

如果你看看使用firebug的站點，你可以看到作者正在使用jQuery JavaScript框架來實現加載欄。

相關的代碼，在http://www.cssjockey.com/wp-content/themes/cj_pro/scripts/custom.js腳本發現在<head>部

$(window).load(function(){ 
$("#loading").addClass("hidden"); 
}); 
$("#loading").ajaxStart(function(){ 
$(this).show(); 
}); 
$("#loading").ajaxStop(function(){ 
$(this).hide(); 
});

其中loading是用於容納加載GIF圖像

div中的id

來源

2009-02-28 14:40:08

這個網站上的加載腳本是如何實現的？

回答

相關問題