blocks|key|3769302|text|我有点搞不懂你到底想要什么，但是如果你想找一个可以用CSS定制的滚动条，只需要看看jQuery+UI's+Slider就行了。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|3769303|您必须添加一些事件处理程序来执行滚动，但总体上应该不会太难。|3769304|entityMap|0|LINK|mutability|MUTABLE|url|http://jqueryui.com/demos/slider/^0|15|I|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

I'm a little confused with what exactly you're asking for, but if you're looking for a scroll bar of some sort that can be customized with CSS, look no further than <a href="http://jqueryui.com/demos/slider/" rel="nofollow">jQuery UI's Slider</a>.

You'll have to add some event handlers to do the scrolling, but it shouldn't be too difficult over-all.

blocks|key|3769416|text|快进到2017年，现在有很多很好的自定义滚动条脚本。我所说的好，是指那些依赖于本地滚动机制并且也可以在移动设备上工作的工具。我使用的是Perfect+Scrollbar。在这篇博客文章中，其他一些好的可以是found+here。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|3769417|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/noraesae/perfect-scrollbar|1|http://blog.dynamicdrive.com/top-7-custom-scrollbar-javascript-and-jquery-plugins/^0|1V|H|0|2V|A|1|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]|$A|R|B|S|1|T]]|C|$]]|$1|D|3|-4|5|6|7|U|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]|L|$5|G|H|I|C|$J|M]]]]

Fast forward to 2017, and there are a lot of good custom scrollbar scripts these days. By good I mean ones that rely on native scrolling mechanics and works on mobile devices too. The one I use is <a href="https://github.com/noraesae/perfect-scrollbar" rel="nofollow noreferrer">Perfect Scrollbar</a>. Some other good ones can be <a href="http://blog.dynamicdrive.com/top-7-custom-scrollbar-javascript-and-jquery-plugins/" rel="nofollow noreferrer">found here</a> in this blog post.

blocks|key|3769334|text|下面是一些您可以使用的自定义滚动条：http://www.net-kit.com/jquery-custom-scrollbar-plugins/|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|3769335|这些解决方案中的一个应该是有效的。顺便说一句，我用的是JScrollpane，它对我来说很有吸引力|3769336|entityMap|0|LINK|mutability|MUTABLE|url|http://www.net-kit.com/jquery-custom-scrollbar-plugins/^0|I|1J|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

Here are some custom scrollbars you can use:
<a href="http://www.net-kit.com/jquery-custom-scrollbar-plugins/" rel="nofollow">http://www.net-kit.com/jquery-custom-scrollbar-plugins/</a> 

One off these solutions should work. BTW i use JScrollpane and it works like a charm for me

blocks|key|310061|text|我浏览了上面的所有建议，但对以下两个问题之一感到失望：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|310062|跨浏览器compatibility|310063|lag|unordered-list-item|310064|
|310065|a性能差的|310066|大量冗余代码/依赖项(jQuery+UI)|ordered-list-item|310067|310068|310069|因此，我使用了一些CSS技巧和JavaScript+(取决于jQuery选择器)来构建我自己的自定义滚动条实现。该演示可在https://dev.anuary.com/680a3c94-9651-550f-abca-e853613eb9ce/上找到。源代码托管在https://github.com/anuary/jquery-custom-scrollbar上。|offset|length|310070|我的方法依赖于本机浏览器滚动条。但是，此实现不支持水平滚动条。|310071|entityMap|0|LINK|mutability|MUTABLE|url|https://dev.anuary.com/680a3c94-9651-550f-abca-e853613eb9ce/|1|https://github.com/anuary/jquery-custom-scrollbar^0|0|0|0|0|0|0|0|0|1P|1O|0|3N|1D|1|0|0^^$0|@$1|2|3|4|5|6|7|15|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|16|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|17|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|18|8|@]|9|@]|A|$]]|$1|I|3|J|5|F|7|19|8|@]|9|@]|A|$]]|$1|K|3|L|5|M|7|1A|8|@]|9|@]|A|$]]|$1|N|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|1C|8|@]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1D|8|@]|9|@$R|1E|S|1F|1|1G]|$R|1H|S|1I|1|1J]]|A|$]]|$1|T|3|U|5|6|7|1K|8|@]|9|@]|A|$]]|$1|V|3|-4|5|6|7|1L|8|@]|9|@]|A|$]]]|W|$X|$5|Y|Z|10|A|$11|12]]|13|$5|Y|Z|10|A|$11|14]]]]

I went through all of the suggestions above and was disappointed by either of the following issues:

<ol>
<li>poor cross-browser compatibility</li>
<li>lag</li>
<li>a lot of redundant code/ dependencies (jQuery UI)</li>
</ol>

Therefore, I've used some CSS trickery and JavaScript (depends on jQuery selectors) to build my own custom scrollbar implementation. The demo is available at <a href="https://dev.anuary.com/680a3c94-9651-550f-abca-e853613eb9ce/" rel="nofollow">https://dev.anuary.com/680a3c94-9651-550f-abca-e853613eb9ce/</a>. The source code is hosted at <a href="https://github.com/anuary/jquery-custom-scrollbar" rel="nofollow">https://github.com/anuary/jquery-custom-scrollbar</a>.

My approach relies on the native browser scrollbar. However, this implementation does not support horizontal scrollbars.

blocks|key|3769401|text|我刚刚找到了这个，没有jQuery，如果有人感兴趣的话：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3769402|http://www.script-tutorials.com/custom-scrollbars-cross-browser-solution/|offset|length|3769403|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|21|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@$D|O|E|P|1|Q]]|A|$]]|$1|F|3|-4|5|6|7|R|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|C]]]]

Just found this, without jQuery, if anyone is interested:

<a href="http://www.script-tutorials.com/custom-scrollbars-cross-browser-solution/" rel="nofollow">http://www.script-tutorials.com/custom-scrollbars-cross-browser-solution/</a>

I am hoping to incorporate custom scrollbars in my site as there are divs with set heights that will overflow. I have managed to get exactly what I want using webkit styling in css however I am aware that there will be issues when looking at the site in Firefox or IE.

As a result, I tried to incorporate the jScrollPane library into my site but its causing all sorts of js "clashes" which is throwing the whole site into a mess!

Are there any simpler methods to customise my scroll bar so that I have cross browser compatibility without adding a new js page to the site?

Alternatively - is there a way I can attach something to the css for when the browser is firefox!?

Thanks
JD

Custom scrollbar

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

我希望在我的网站纳入自定义滚动条，因为有设置高度的div将溢出。我已经设法在css中使用webkit样式获得了我想要的东西，但是我意识到在Firefox或IE中查看站点时会出现问题。结果，我试图将jScrollPane库整合到我的站点中，但是它引起了各种各样的js“冲突”，把整个站点搞得一团糟！有没有更简单的方法可以自定义我的滚动条，这样我就可以跨浏览器兼容，而不需要向站点添加新的js页面？或者-

问自定义滚动条
EN

回答 5

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问自定义滚动条EN

回答 5

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问自定义滚动条
EN