progress.js如何安裝使用

這篇文章給大家分享的是有關progress.js如何安裝使用的內容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

　　Progressjs是個JavaScript和css3庫，幫助開發者創建網頁上每個對象的管理進度條。支持頁面元素、圖像、視頻、文本輸入等，用戶可以自定義進度條模板，而且很方便使用。

　　progress.js安裝使用

　　//tosetprogress-barforwholepage

　　progressjs().start();

　　//orforspecificelement

　　progressjs("#targetElement").start();

　　progress.js的使用方法

　　NProgress.start()—顯示進度條

　　NProgress.set(0.4)—設置百分比

　　NProgress.inc()—增加一點點

　　NProgress.done()—完成進度條

　　你也可以...

　　添加到你調用Ajax的地方！綁定它到jQueryajaxStart和ajaxStop事件上

　　沒有Turbolinks/Pjax一樣可以制造一個美妙的進度條！把它綁定到$(document).ready和$(window).load

　　配置插件

　　通過minimum來修改最小百分比。

　　NProgress.configure({minimum:0.1});

　　你可以通過template修改標記結構。為了保證進度條正常工作，需要一個包含role='bar'屬性的元素。

　　NProgress.configure({

　　template:"..."

　　});

　　通過ease(一個CSS中的easing值)調整動畫設置和速度speed（毫秒ms）。

　　NProgress.configure({ease:'ease',speed:500});

　　想關閉進度條步進？設置trickle為false。

　　NProgress.configure({trickle:false});

　　你可以調整trickleRate(每次步進增長多少)和trickleSpeed(步進間隔，單位毫秒ms).

　　NProgress.configure({trickleRate:0.02,trickleSpeed:800});

　　想禁用進度環？設置showSpinner為false。

　　NProgress.configure({showSpinner:false});

感謝各位的閱讀！關于“progress.js如何安裝使用”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！