99热在线精品一区二区三区_国产伦精品一区二区三区女破破_亚洲一区二区三区无码_精品国产欧美日韩另类一区

本文實例為大家分享了jquery css實現(xiàn)流程進度條的具體代碼，供大家參考，具體內(nèi)容如下

從事綿陽機房托管，服務(wù)器租用，云主機，網(wǎng)頁空間，域名注冊，CDN，網(wǎng)絡(luò)代維等服務(wù)。

方案1：

方案2：

 





 

 

 

 

 

 

 
1
 
 

 
2
 
 

 
3
 
 

 
4
 
 

 
5
 
 
 
 
 

 
 
 
 



 

使用：

1.首先要引入一個jquery.js

2.CSS：

:root開始所有css(css基本上都使用的變量，改樣式只需要改:root里的變量值就行)

3.JS：

保留所有js方法
調(diào)用loadProgress(1000,2)方法，傳入進度條長度、最后一個激活節(jié)點下標(biāo)(0到節(jié)點的length-1)
186行設(shè)置了整體相對于父級div居中，自己看需求改一下就好

4.標(biāo)簽：

主要就是class="progress_line_no"的div里的所有元素,最里面的兩層div就是節(jié)點,class="progress_text"的div是文字,它們的父級div是圓點

5.激活節(jié)點優(yōu)先級

loadProgress(width,index)方法傳入index為最高級別,其次是div上class="progress_node_currentActive",最后默認(rèn)0

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。