使用JQ来实现浏览器滚动条
作者:崔凯 来源:崔凯的博客 【大 中 小】 浏览: 添加日期：2009-07-17 我要评论(10)
通过修改CSS来更换s滚动条样式，只能更换颜色，而不能更改滚动条的大小。
况且还有浏览器兼容的问题：
我们可以选择jquery来做该效果，这样即修改了滚动条的大小，又可以做到兼容：
JS代码如下(附：jquery.linscroll.js)：
<script type="text/javascript" src="jquery-1.1.3.1.js"></script>
<script type="text/javascript" src="jquery.linscroll.js"></script>
<script type="text/javascript">
$(document).ready(
function(){
$(’#scrollContent’).setScroll( //scrollContent为滚动层的ID
{img:scroll_bk.gif’,width:10},//背景图及其宽度
{img:scroll_arrow_up.gif’,height:3},//up image
{img:scroll_arrow_down.gif’,height:3},//down image
{img:scroll_bar.gif’,height:25}//bar image
);});
</script>
html代码如下：
<div id="scrollContent" style="width:140px;overflow:hidden;height:170px;">
内容
</div>
（如果您觉得本站不错，请告诉身边的朋友，或转载到论坛、百度知道、贴吧等，记得带网址哟，不胜感激！）
〖DIV+CSS实例〗Tags: jq jquery 浏览器 滚动条 更改滚动条样式
相关文章
更多评论(10)..会员评论
- smkoy(59.32.*.*) 发表于：2011-07-22 10:24:57
- 图片在哪里？
- niko(116.226.*.*) 发表于：2011-01-25 16:11:31
- 鼠标滚动轮事件没写啊，这个加上就更好了。
- deadenemy(114.132.*.*) 发表于：2010-08-05 14:03:47
- 图片文件在哪里呀?
- wendyshao(222.128.*.*) 发表于：2010-04-22 14:27:46
- 谢谢你的分享，我想问下怎么变成横向滚动呢？
- 管理员回复：改横向的就麻烦了
- hawk98081(117.40.*.*) 发表于：2010-04-16 14:03:58
- 看看
- yy2zmg(119.123.*.*) 发表于：2010-03-14 03:02:27
- 这个有个BUG 就是第一次点击 scroll_bar时就移动鼠标就滑动了`
- tt(116.5.*.*) 发表于：2009-09-30 13:33:05
- jquery-1.1.3.1.js 没看到有下载啊怎么个添加路径？ img：../images/scroll_bai.gif这样吗？
- 管理员回复：这个请到jquery官方网站上下载
- tichan(121.9.*.*) 发表于：2009-09-28 16:55:46
- 但是什么教材是两个js啊 怎么只有一个js下载？jquery-1.1.3.1.js 这个呢？
- 管理员回复：jquery-1.1.3.1.js 这个请到jquery官方网站下载
推荐文章
热门文章
最新图片素材
最新评论文章
推荐专题
在线交流QQ群
- 106310407(开)
- 55427134(开)
- 2993401(开)
- 30235673(开)
- 33424604(开)
- 2993401(开)
- 161512108(开)
- 161510519(开)
- 158375021(开)
- 155858414(开)
- 143309878(开)
- 16373807(开)
- 129098721(开)
- 123473199(开)
- 146991009(开)
- 135792800(开)