像 Google Plus 一样劫持页面滚动？
1) 如果您有 Google Plus 帐户，请转到您的主页。
2) 在右侧，有一个“添加到圈子”按钮列表，您可以将鼠标悬停在其上。
3) 请注意，当您将鼠标悬停在“添加到圈子”下拉列表之一上时（如果您有足够的圈子可以在下拉列表中滚动），页面滚动功能将被禁用。仅允许在下拉列表中垂直滚动。
这是如何使用 javascript 完成的？
我可以在此处滚动（滚动条右侧的栏），但在下拉时无法在页面主体上滚动。
1) If you have a Google Plus account, go to your home page.
2) On the right side, there's a list of "Add to Circle" buttons that you can hover over.
3) Notice that when you hover over one of the Add to Circle dropdown (if you have enough circles to have scrolling in the dropdown) the page scrolling feature is disabled. Only scrolling vertically in the dropdown is allowed.
How is this done with javascript?
I can scroll in here (the scroll bar on the right), but can't scroll on the page body while this is dropped down.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
有一个具有固定高度并且自动溢出的元素，他们使用以下技巧设置滚动条的样式： http://beautifulpixels.com/goodies/create-custom-webkit-scrollbar/
你可以让它在 FF 和 IE 中工作：基本上你将一个溢出自动元素嵌套到另一个元素中并隐藏带有负边距的滚动条。然后，您捕获同一元素上的滚动事件，并根据滚动顶部位置调整右侧的滑块。
这是我的做法： http://jsfiddle.net/kGbbP/4/
但是有有很多 jquery 插件可以做到这一点：
http://www.net-kit.com/jquery-custom-scrollbar-插件/
The have an element that has a fixed height and is overflow auto, they styles the scrollbar with this trick: http://beautifulpixels.com/goodies/create-custom-webkit-scrollbar/
You could make it work in FF and IE to: Basically you nest a element that is overflow auto into a other and hide the scrollbar with a negative margin. Then you capture the scroll event on that same element and adapt the slider on the right side according to the scrollTop position.
Here is how i would do it: http://jsfiddle.net/kGbbP/4/
But there are many jquery plugins that can do this:
http://www.net-kit.com/jquery-custom-scrollbar-plugins/
这不是通过 JavaScript 创建的！
它是纯 CSS，仅适用于（非移动）基于 webkit 的浏览器。
这是 CSS 代码，只需将其包含在 CSS 文件中，将其附加到 HTML 文档，然后运行 .html 文件即可。
这是一个演示： http://jsfiddle.net/3ZqGu/
这是 CSS 代码：
this isn't made via JavaScript!
It's pure CSS, and works only on (non-mobile) webkit based browsers.
Here is the CSS code, just include it in a CSS file, attach it to an HTML document, and run the .html file.
Here is a demo: http://jsfiddle.net/3ZqGu/
And here is the CSS code: