今天為大家分享一下我自己制作的瀏覽器滾動條,我們知道用css來自定義滾動條也是挺好的方式,css雖然能夠改變chrome瀏覽器的滾動條樣式可以自定義,css也能夠改變IE瀏覽器滾動條的顏色。但是css只能是改變IE瀏覽器的顏色,而且CSS不能做到改變火狐瀏覽器的樣式和顏色。所以只能是通過JavaScript來實現(xiàn)了。也有插件可以做到。我分享一下我自己使用原生JavaScript實現(xiàn)的思路。先上個圖看下效果:
JavaScript實現(xiàn)的思路就是模擬瀏覽器自身滾動條。我制作的思路是先將整個文檔放在一個容器里面,然后通過改變?nèi)萜骼锩娴膁iv的top值來實現(xià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