NiceScroll - 保持原始滚动条完好无损答案

【问题标题】：NiceScroll - Leaving Original Scrollbar IntactNiceScroll - 保持原始滚动条完好无损
【发布时间】：2014-02-01 02:56:58
【问题描述】：

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

但是，该插件似乎也适用于设置滚动条样式。在使用这个插件的过程中是否可以保留浏览器滚动条的原始样式？

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

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

【问题讨论】：

标签： jquery styles scrollbar nicescroll

【解决方案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
 }

如果你不喜欢编辑插件，你必须删除“overflow:hidden;”从正文内联样式来看，这就是插件的作用。

当您从插件中删除了这些行，或者以其他方式删除了“溢出：隐藏；”从身体元素。您必须从插件中隐藏栏杆。

这就是我所做的：

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

您可以看到一个工作示例here

【讨论】：

【解决方案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

【讨论】：

感谢您的回答。不幸的是 - 必须按照原来的样式设置滚动条（就像我想开发这个网站一样）。
啊，好吧，别担心，我只是想以防万一。
我不知道您是否找到了解决方案，但我知道另一个插件可以提供很好的滚动效果并保持原始栏完好无损 - 如果您查看我目前正在使用的这个测试页面工作，你可以看到一个例子 - zimxtrial.ukbigbuy.com