顯示水平進度欄頁面下載過

Question

一些時間上的網頁需要時間來下載，而無需用戶注意到它......這在某些情況下破壞了頁面功能，如果按鈕的圖像用戶點擊其中有一些事件處理程序連接到它。

我可以使用下面的代碼中使用的圖像或一些動畫顯示加載效果。

$(window).bind("load", function() { 
    $('#loading').fadeOut(2000); 
}); 

例如，這link使用通用加載圖像文件顯示頁進程。

我想添加具有寬度100％，高約10個像素，並且總是在頁面底部浮動的水平進度條什麼。

我不知道我怎麼能做到這一點任何想法..或例子，我可以看看

Answer 1

Fiddle

您可以採取div，與10px height和0% width。後，您可以使用csstransition 2秒，並增加你的DIV的寬度爲100％，它會出現一個進度條。