您的位置:首页 > 其它

自制滚动条

2016-07-02 12:47 218 查看
1.在页面中引用scrollbar.js

2.在页面中引入scroll_bar样式

<div id="dv_scroll_bar" >
<div id="dv_scroll_track" class="Scrollbar-Track">
<div class="Scrollbar-Handle"></div>
</div>
</div>
#dv_scroll_bar {position:absolute;right:8%;top:150px;width:14px;height:520px;border-left:1px solid #B5B5B5;}
#dv_scroll_bar .Scrollbar-Track{position:absolute;left:0;top:20px;width:14px;height:350px;}
#dv_scroll_bar .Scrollbar-Handle{position:absolute;left:-3px;top:0;width:13px;height:95px;overflow:hidden;background:url(${pageContext.request.contextPath}/images/fanye.png) no-repeat;cursor:pointer;}


3.在页面中定义需要滚动的div,div必须定位为absolute样式
<div style="overflow:hidden;height:540px;position:absolute;width:73%;margin-top:90px;" id="scroll1">
<div class="project_detail" style="position:absolute;" id="project_detail">
</div>
</div>

4.加载完页面后启动该js
CM.intro.start('project_detail','scroll1','dv_scroll_bar');
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: