niceScroll

在 mounted 或 頁面最尾處 使用

1. 基本使用：

$('dom').niceScroll()

2. 自定義樣式：

$('dom').niceScroll({cursorcolor: 光標顏色cursorwidth: 光標寬度cursorborder: 光標邊框cursorborderradius: 光標邊框圓角cursoropacitymin: 光標透明度最小值background: 滾動條背景autohidemode: 滾動條隱藏模式 })

3. 高度定制：

另外添加類似如下代碼：

.nicescroll-rails-vr .nicescroll-cursors {background-image: linear-gradient(...); // 線性漸變animation: pace-stripe-animation 500ms linear infinite; // 動畫background-size: 20px 20px;}@keyframes pace-stripe-animation {from { background-position-y: 0; }to { background-position-y: 100%; }}

3.1 線性漸變liner-gradient 筆記 官網

3.2 動畫animation 筆記 官網

4. 包裝div accelerated

<div class="nicescroll-box"><div class="wrapper">內容</div> </div> $('nicescroll-box').niceScroll('wrapper', 樣式(可選))

總結

以上是生活随笔為你收集整理的jQuery 之 niceScroll的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。