jquery自定义滚动条 鼠标移入或滚轮时显示 鼠标离开或悬停超时时隐藏

一、需求：

我需要做一个多媒体播放页面，左侧为播放列表，右侧为播放器。为了避免系统滚动条把列表和播放器隔断开，左侧列表的滚动条需要自定义，并且滚动停止和鼠标离开时要隐藏掉。

二、他山之石：

案例来自http://www.17sucai.com/pins/426.html

但是下载demo需要先注册，还要20积分。显然，这违背了互联网的共享精神，so，F12，load it。

分析源码，发现了一个强大灵活的插件，感谢开发者。

插件：jquery.jscrollpane.min.js

主页: http://jscrollpane.kelvinluck.com/。

API：http://jscrollpane.kelvinluck.com/api.html

三、代码分析：

jquery自定义滚动条 鼠标移入或滚轮时显示 鼠标离开或悬停超时时隐藏。此功能主要通过以下三个js和一个css来实现：

jquery.mousewheel.js——滚轮事件(mousewheel)

scroll-startstop.events.jquery.js——滚轮事件扩展(scrollstart、scrollstop)

jquery.jscrollpane.min.js——自定义滚动条

jquery.jscrollpane.hover.js——自定义滚动条扩展(hover时显示隐藏，此文件是我从页面中抽离出来的，详见下面我的demo)

jscrollpane.css——自定义滚动条样式

四、我的Demo

http://youryida.duapp.com/demo_front/jscrollpaneHover/index.html