自制滚动条
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>
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');
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');
相关文章推荐
- React Native 开发到上线记录(一)
- redis benchmarks
- [51nod]1264 线段相交
- 使用 URL 读取网络资源
- 【VS开发】解决位图缩放失真
- 【论文笔记】Spatial Transformer Networks
- HTTP学习笔记
- oracle 显示中文乱码解决方式
- python之window编译脚本在Linux执行
- SecureCRT连接linux超时问题
- Matlab中dir命令
- mongo集群分片
- 一个Java对象到底占多大内存?
- SSH整合
- android studio 常用快捷键
- matlab中sortrows的用法
- Debug之路-4
- python2.x代码自动转换成python3.x
- 应用签名
- iOS-分段跳转-自定义分段View