進度條，步驟條，

2022-09-04 09:45:11 字數 1584 閱讀 9637

1，記錄一次步驟條來實現人數不同顯示的進度不同

效果如圖：

廢話不多說 上**：

html檔案：

已有


位武魂使共赴蒼嵐


3w預約


5w預約


10w預約


20w預約


30w預約


} }
css **：

.awards-progress 


.awards-progress-cur 


.awards-progress-cur.item0 


.awards-progress-cur.item1 


.awards-progress-cur.item2 


.awards-progress-cur.item3 


.awards-progress-cur.item4 


.awards-progress-cur.item5 


.awards-progress-points 


.awards-progress-points li 


.awards-progress-points li:after 


.awards-progress-points li:nth-child(1) 


.awards-progress-points li:nth-child(2) 


.awards-progress-points li:nth-child(3) 


.awards-progress-points li:nth-child(4) 


.awards-progress-points li:nth-child(5) 


.awards-progress-points li:before 


.awards-progress-points li.down:before 


.awards-progress-points li.up:before 


.awards-progress-points li.activeli


.awards-progress-points li.activeli:after 


.awards-progress-text 


.awards-progress-text li 


.awards-progress-text li:nth-child(odd) 


.awards-progress-text li:nth-child(even) 


.awards-progress-text li:nth-child(1) 


.awards-progress-text li:nth-child(2) 


.awards-progress-text li:nth-child(3) 


.awards-progress-text li:nth-child(4) 


.awards-progress-text li:nth-child(5) 


.awards-progress-text li.finished
簡單實現：

ios弧形進度條 iOS 圓形進度條

釋放雙眼，帶上耳機，聽聽看 今天產品要弄乙個圓形的進度條 有很多開源的進度條不用，非要弄這種效果，就不吐槽了，還是想想怎麼實現 廢話就不多說了 直接上 import inte ce roundprogressview uiview 進度條顏色 property strong,nonatomic ui...

ios弧形進度條 ios 圓形進度條

今天產品要弄乙個圓形的進度條 有很多開源的進度條不用，非要弄這種效果，就不吐槽了，還是想想怎麼實現 廢話就不多說了 直接上 import inte ce roundprogressview uiview 進度條顏色 property strong,nonatomic uicolor progress...

audio 進度條拉不動 audio進度條

如上圖所示 為效果圖 如下 音訊控制進度條 body,padding 0 margin 0 m main 1000 function settimeshow t t math.floor t var playtime secondtomin audio.currenttime size html p...