今天為大家分享一下我自己制作的瀏覽器滾動條,我們知道用css來自定義滾動條也是挺好的方式,css雖然能夠改變chrome瀏覽器的滾動條樣式可以自定義,css也能夠改變IE瀏覽器滾動條的顏色。但是css只能是改變IE瀏覽器的顏色,而且CSS不能做到改變火狐瀏覽器的樣式和顏色。所以只能是通過JavaScript來實現(xiàn)了。也有插件可以做到。我分享一下我自己使用原生JavaScript實現(xiàn)的思路。先上個圖看下效果:

iOS培訓(xùn),Swift培訓(xùn),蘋果開發(fā)培訓(xùn),移動開發(fā)培訓(xùn)

JavaScript實現(xiàn)的思路就是模擬瀏覽器自身滾動條。我制作的思路是先將整個文檔放在一個容器里面,然后通過改變?nèi)萜骼锩娴膁iv的top值來實現(xiàn)滾動效果布局如下:

iOS培訓(xùn),Swift培訓(xùn),蘋果開發(fā)培訓(xùn),移動開發(fā)培訓(xùn)

 1 <style> 2     *{ 3         margin:0; 4         padding:0; 5     } 6     body{ 7         overflow:hidden; 9     }10     #box{11         float:right;12         top:0;13         right:0;14         width:20px;15         background:#ccc;16         position:relative;17     }18     #drag{19         position: a