純CSS和jQuery實現的在頁面頂部顯示的進度條效果

純CSS和jQuery實現的在頁面頂部顯示的進度條效果

一、純CSS實現

昨天在網上閒逛時，看到一個部落格的頁面最頂部有一個進度條特效，感覺挺好的'，就分析了一下程式碼，找出了其中的關鍵部份，使用純CSS實現的，給大家分享一下。

二、JQuery實現

一個在頁面頂部顯示的進度條效果，像在智慧手機上瀏覽網頁一樣，手機上的瀏覽器進度條一般都在螢幕頂部，一條極細的小線條，當頁面載入的時候，它就不斷的載入顯示進度，本網頁進度條特效與此十分相似，基於jquery外掛實現的效果。