隐藏滚动条并像 facebook 的新聊天侧边栏一样悬停显示 [英] hide scrollbar and show on hover like facebook's new chat sidebar

问题描述

Facebook 刚刚更新了聊天(又一次)，现在一个新的固定边栏留在屏幕左侧.当其内容溢出时，会出现滚动条，但前提是使用鼠标滚轮滚动或鼠标移动到(或靠近)滚动条时.如果鼠标不在它上面，它就会淡出.它对于事物窗口对象(例如聊天本身)非常有用.那么它是如何工作的?

Facebook just updated chat (yet again) and now a new fixed side bar stays on the left of the screen. when its contents overflow, a scroll bar appears, but only if scrolled with the mouse wheel or if mouse moves over (or near) the scroll bar. It fades out if the mouse is not over it. it is very useful for thing windowed objects (such as the chat itself). So how does it work?

PS 我正在寻找一个纯 html5/css/javascript 解决方案(没有 jquery 之类的)，不需要浏览器支持，应该可以在最新的 chrome 中运行，仅此而已，因为我只为 chrome 制作一个应用程序.

PS i am looking for a pure html5/css/javascript solution (no jquery or such), no browser support necessary, should work in latest chrome and nothing more, since i am making an app for chrome only.

推荐答案

这是对 Stephen P. 的帖子的更新，其中包含样式化滚动条.

Here is an update to Stephen P.'s post to have a styled scroll bar.

http://jsfiddle.net/PVZB8/139/

-迈克

这篇关于隐藏滚动条并像 facebook 的新聊天侧边栏一样悬停显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！