Скрыть полосу прокрутки и показать при наведении, например, на боковой панели facebook new chat

Facebook только что обновил чат (еще раз), и теперь новая фиксированная боковая панель остается слева от экрана. при переполнении содержимого появляется полоса прокрутки, но только если она прокручивается с помощью колеса мыши или если мышь перемещается (или приближается) к полосе прокрутки. Он исчезает, если мышь не над ним. это очень полезно для объектов с окнами объектов (таких как сам чат). Итак, как это работает?

PS Я ищу чистое решение html5/css/javascript (без jquery или такого), без необходимости поддержки браузера, должен работать в последнем хроме и ничего больше, так как я создаю приложение только для хром.

Ответ 1

Вот обновление для статьи Стивена П., чтобы иметь стилизованную полосу прокрутки.

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

-Mike

Ответ 2

Обычно вы устанавливаете переполнение на none и меняете его на overflow-y: scroll при наведении указателя мыши.

См. http://jsfiddle.net/PVZB8/

Ответ 3

Это не может быть точным ответом на вопрос, потому что ему предлагается решение без jQuery. Но я пришел сюда через поисковую систему, и я использую jQuery. Если вы хотите, чтобы решение выглядело так же гладко, а выглядело так же, как в facebook, взгляните на это:

См. http://rocha.la/jQuery-slimScroll

Ответ 4

Вы также можете проверить nano scroller.

Ответ 5

Я хотел бы оживить этот поток в интересах будущих посетителей и, по сути, подытожить другие ответы на эту тему. Я предпочитаю jsFancyScroll (спасибо Лео Селиг!), А также nanoScrollerJS (спасибо ip!), потому что они оба сохраняют естественный опыт прокрутки ОС ". Просто попробуйте найти подборку текста, а затем посмотрите на местоположение полосы прокрутки в различных реализациях, чтобы увидеть, что я имею в виду.

Если вам не нравится стилизовать полосу прокрутки и просто хочу, чтобы она автоматически скрывалась, Stephen P выглядит наиболее элегантно и лучше всего поддерживается.