niceScroll滾動條使用
有時候我們可能覺得系統(tǒng)默認的滾動條太丑，想要改變它，雖然可以通過css來改變，但是火狐直接不支持css改變滾動條，所以我們用js來解決

niceScroll官網(wǎng)：https://nicescroll.areaaperta.com/
jQuery官網(wǎng)：https://jquery.com/

niceScroll插件基于jQuery，所以先引入jQuery

基本配置

$("[user-basic-message]").niceScroll({touchbehavior: false,cursorcolor: "#000",cursoropacitymax: 1,cursorwidth: 5,cursorborder: "none",cursorborderradius: "4px",background: "",autohidemode: false});

效果圖

niceScroll參數(shù)

cursorcolor - 十六進制改變光標顏色，默認值是“＃000000”
cursoropacitymin - 改變不透明度非常光標處于非活動狀態(tài)（scrollabar“隱藏”狀態(tài)），范圍從1到0，
默認為0（隱藏）
cursoropacitymax - 改變不透明度非常光標處于活動狀態(tài)（scrollabar“可見”狀態(tài)），范圍從1到0，默
認值是1（完全不透明）
cursorwidth - 像素光標的寬度，默認值為5（你可以寫“加入5px”太）
cursorborder - 游標邊框css定義，默認為“1px的固體＃FFF”
cursorborderradius - 以像素為光標邊界半徑，默認為“遞四方”
zIndex的 - 改變z-index值的滾動條的div，默認值是9999
scrollspeed - 滾動速度，默認值為60
mousescrollstep - 高速滾動鼠標滾輪，默認值是40（像素）
touchbehavior - 使光標拖動滾動像在臺式電腦觸摸設備（默認：false）
hwacceleration - 使用硬件加速滾動支持的時候（默認：true）
boxzoom - 使變焦框中的內(nèi)容（默認：false）
dblclickzoom - （僅當boxzoom = TRUE）變焦激活時，雙擊對話框（默認：true）
gesturezoom - （僅當boxzoom =真實，使用觸摸設備）上縮放框激活時，間距輸出/輸入（默認：true）
grabcursorenabled，顯示“搶”圖標的div touchbehavior = true時，（默認：true）
autohidemode，如何隱藏滾動條的作品，真=默認/“光標”=只進游標隱藏/ false =不隱藏背景，CSS改變軌道的背景下，默認為“”
iframeautoresize，在加載事件AUTORESIZE的iframe（默認：true）
cursorminheight，設置在像素的最小光標高度（默認值：20）
preservenativescrolling，您可以滾動本機可滾動區(qū)域用鼠標，冒泡鼠標滾輪事件（默認：true）
railoffset，您可以添加抵消頂部/左邊的軌道位置（默認：false）
bouncescroll，使?jié)L動彈跳在內(nèi)容結(jié)尾作為移動像（僅HW ACCELL）（默認：false）
spacebarenabled，使向下翻頁時，空格鍵已經(jīng)按下滾動（默認：true）
railpadding，設置填充為鐵路吧（默認值：{頂：0，右：0，左：0，下：0}）
disableoutline，對于chrome瀏覽器，停用大綱（橙色hightlight）選擇具有nicescroll一個div（默認：
true）時，
horizrailenabled，nicescroll可以管理水平滾動（默認：true）
railalign，取向垂直導軌（defaul：“右”）
railvalign，對齊水平導軌（defaul：“底部”）
enabletranslate3d，nicescroll可以使用CSS轉(zhuǎn)換為滾動內(nèi)容（默認：true）
enablemousewheel，nicescroll可以管理的鼠標滾輪事件（默認：true）
enablekeyboard，nicescroll可以管理鍵盤事件（默認：true）
smoothscroll，滾動自如移動（默認：true）
sensitiverail，點擊軌道上進行滾動（默認：true）
enablemouselockapi，可以用鼠標說明鎖的API（對象拖動同樣的問題）（默認：true）
cursorfixedheight，用于光標在像素設置固定的高度（默認：false）
hidecursordelay，設置在微秒淡出滾動條的延遲時間（默認值：400）
directionlockdeadzone，在對方向鎖定激活像素死區(qū)（默認值：6）
nativeparentscrolling，檢測內(nèi)容底部，并讓家長來滾動，作為原生滾動做（默認：true）
enablescrollonselection，啟用自動滾動的內(nèi)容時，選擇文本（默認：true）

（參數(shù)來自：https://www.cnblogs.com/cssfirefly/p/3446140.html）

總結(jié)

以上是生活随笔為你收集整理的niceScroll滚动条使用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。