Question

我已将NiceScroll jQuery插件添加到我的页面中，它完全符合我的要求（轻松滚动鼠标滚轮事件）。

但是，该插件似乎也适用于滚动条的样式。在使用此插件时是否可以保留浏览器滚动条的原始样式？

我检查了documentation并尝试了很多参数，但似乎无法找到相关参数。

在当前状态下，滚动条不可见。

Answer 1

我不知道这是否仍然相关，但无论如何我遇到了同样的问题，并找到了解决方案：

只需从插件中删除此部件，在版本3.4.0中，它位于第706-711行。

 if (!cap.isie9mobile) self.css(cont,{'overflow-y':'hidden'});      

 if (self.ispage&&cap.isie7) {
    if (self.doc[0].nodeName=='BODY') self.css($("html"),{'overflow-y':'hidden'});  //IE7 double scrollbar issue
    else if (self.doc[0].nodeName=='HTML') self.css($("body"),{'overflow-y':'hidden'});  //IE7 double scrollbar issue
 }

如果您不喜欢编辑插件，则必须删除＆＃34; overflow：hidden;＆＃34;从body inline样式来看，这就是插件的作用。

如果您已从插件中删除了这些行，或者以其他方式删除了＆＃34; overflow：hidden;＆＃34;来自身体元素。你必须从插件中隐藏栏杆。

这就是我所做的：

$(document).ready(function(){
    $("html").niceScroll();
    $('.nicescroll-rails').remove();
});

您可以看到一个有效的示例here

Answer 2

我不知道如何保留原文，但是如果您不能这样做，您可以轻松地为滚动条设置样式：

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.5); 
    border-radius: 8px;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.8); 
}

恕我直言，它看起来更好用一些漂亮的简单造型，无论如何，没有人喜欢看默认滚动条：P

NiceScroll - 保留原始滚动条完整

2 个答案: