Nicescroll滾動條插件是一個非常強大的基于JQUERY的滾動條插件，不需要增加額外的css，幾乎全瀏覽器兼容。ie6+，實現只需要一段代碼，侵入性非常小，樣式可完全自定義，支持觸摸事件，可在觸摸屏上使用。

官網地址：http://www.areaaperta.com/nicescroll/

引入核心文件，插件需要引入1.5.X以上版本的jquery庫

最簡單的用法如下：

$(document).ready(
? function() {
??? $("html").niceScroll(); });

注意：一定要放在?$(document).ready 中進行初始化！

滾動條可以隱藏和顯示：

$("#mydiv").getNiceScroll().hide();

$("#mydiv").getNiceScroll().show();

檢測滾動條是否重置大小（當窗口改變大小時）:

$("#mydiv").getNiceScroll().resize();

開發過程遇到問題：

1.雙層div,內層div滾動時同側會出現兩個滾動條

原因：內層div設置了高度，新增了一個滾動條

解決：內層div不設置高度（如果為橫向滾動則不設置寬度，最好高度和寬度都不設置）

2.手機端拖拽無法激活滾動條

原因：未明

解決：在加載時先設置滾動條顯示：$("#mydiv").getNiceScroll().show();

? ? ? ?? 然后再重置滾動條大小：$("#mydiv").getNiceScroll().resize();

這兩個問題困擾了我一天，希望可以給其他有同類問題的朋友一些啟發。

參考網址：https://www.cnblogs.com/jinqi79731/p/nicescroll.html

總結

以上是生活随笔為你收集整理的Nicescroll滚动条插件手机端问题总结的全部內容，希望文章能夠幫你解決所遇到的問題。

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