<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312">
<meta name="keywords" content="web启点,jquery滚动条插件jscroll">
<meta name="description" content="改变滚动条">
<meta name="googlebot" content="index,follow,archive">
<meta name="BaiduSpider" content="index,follow,archive">
<meta name="robots" content="index,follow">
<title>web启点--jquery滚动条插件jscroll</title>
<style>
body{padding:10px 0 0px 0;margin:0; font-size:12px; color:#666666; line-height:20px;}
p.text{padding:10px; margin:10px; background:#f5f5f5; border:1px solid #ccc;}
.fontRed{ color:#FF0000}
.title{font-family:Verdana, Arial; font-weight:bold; font-size:14px; padding:0 20px}
.demo{ width:500px; margin:30px; font-size:12px; padding:1px; border:1px solid #ccc;}
.demo2{ border:1px solid #ccc; padding:1px; background:#fff; width:700px; margin:20px;}
.logo h1,.footer h1{ height:1px; overflow:hidden; padding:0; margin:0; line-height:20px; font-size:12px; display:block}
.footer { border-top:1px dotted #ccc; font-family:Verdana, Arial, Helvetica, sans-serif; background:#efefef}
.footer .copyRight{padding:20px; font-size:11px;}
.footer .copyRight p a{ text-decoration:none;}
pre.text{padding:10px; margin:10px; background:#f5f5f5; border:1px solid #ccc;}
.img{ border:1px solid #efefef; padding:1px; background:#fff; width:99px; margin:0 0 0 20px}
#tt,#cc,#ee{background:#f5f5f5; height:100px;}
.download{font-size:18px; font-family:Verdana, Arial, Helvetica, sans-serif; padding:20px}
</style>
<script language="javascript" src="jscroll_files/jquery.js"></script>
<script language="javascript" src="jscroll_files/jscroll.js"></script>
<script type="text/javascript">
/*--------------------------------------------------------------------------------------------------*/
$(document).ready(function(){
$("#tt").jscroll();
$("#cc").jscroll({W:"12px"});
$("#ee").jscroll({W:"12px",Btn:{btn:false}});
/*---------------------------------------------------------以下为自定义滚动条样式，设置时注意逗号--------------*/
$(".dd").jscroll({ W:"15px"//设置滚动条宽度
,BgUrl:"url(tpImg/s_bg.gif)"//设置滚动条背景图片地址
,Bg:"right 0 repeat-y"//设置滚动条背景图片position,颜色等
,Bar:{Pos:"bottom"//设置滚动条初始化位置在底部
,Bd:{Out:"#bcbcbc",Hover:"#ccc"}//设置滚动滚轴边框颜色：鼠标离开(默认)，经过
,Bg:{Out:"-45px 0 repeat-y",Hover:"-58px 0 repeat-y",Focus:"-71px 0 repeat-y"}}//设置滚动条滚轴背景：鼠标离开(默认)，经过，点击
,Btn:{btn:true//是否显示上下按钮 false为不显示
,uBg:{Out:"0 0",Hover:"-15px 0",Focus:"-30px 0"}//设置上按钮背景：鼠标离开(默认)，经过，点击
,dBg:{Out:"0 -15px",Hover:"-15px -15px",Focus:"-30px -15px"}}//设置下按钮背景：鼠标离开(默认)，经过，点击
,Fn:function(){}//滚动时候触发的方法
});
$(".ff").jscroll({ W:"15px"
,BgUrl:"url(tpImg/s_bg2.gif)"
,Bg:"right 0 repeat-y"
,Bar:{Bd:{Out:"#a3c3d5",Hover:"#b7d5e6"}
,Bg:{Out:"-45px 0 repeat-y",Hover:"-58px 0 repeat-y",Focus:"-71px 0 repeat-y"}}
,Btn:{btn:true
,uBg:{Out:"0 0",Hover:"-15px 0",Focus:"-30px 0"}
,dBg:{Out:"0 -15px",Hover:"-15px -15px",Focus:"-30px -15px"}}
,Fn:function(){}
});
$(".gg").jscroll({ W:"15px"
,BgUrl:"url(tpImg/s_bg3.gif)"
,Bg:"right 0 repeat-y"
,Bar:{Bd:{Out:"#bcbcbc",Hover:"#ccc"}
,Bg:{Out:"-45px 0 repeat-y",Hover:"-58px 0 repeat-y",Focus:"-71px 0 repeat-y"}}
,Btn:{btn:true
,uBg:{Out:"0 0",Hover:"-15px 0",Focus:"-30px 0"}
,dBg:{Out:"0 -15px",Hover:"-15px -15px",Focus:"-30px -15px"}}
,Fn:function(){}
});
$(".hh").jscroll({ W:"15px"
,BgUrl:"url(tpImg/s_bg4.gif)"
,Bg:"right 0 repeat-y"
,Bar:{Bd:{Out:"#bcbcbc",Hover:"#ccc"}
,Bg:{Out:"-45px 0 repeat-y",Hover:"-58px 0 repeat-y",Focus:"-71px 0 repeat-y"}}
,Btn:{btn:true
,uBg:{Out:"0 0",Hover:"-15px 0",Focus:"-30px 0"}
,dBg:{Out:"0 -15px",Hover:"-15px -15px",Focus:"-30px -15px"}}
,Fn:function(){}
});
$(".ii").jscroll({ W:"15px"
,BgUrl:"url(tpImg/s_bg5.gif)"
,Bg:"right 0 repeat-y"
,Bar:{Bd:{Out:"#064697",Hover:"#064697"}
,Bg:{Out:"-45px 0 repeat-y",Hover:"-58px 0 repeat-y",Focus:"-71px 0 repeat-y"}}
,Btn:{btn:true
,uBg:{Out:"0 0",Hover:"-15px 0",Focus:"-30px 0"}
,dBg:{Out:"0 -15px",Hover:"-15px -15px",Focus:"-30px -15px"}}
,Fn:function(){}
});
});
</script>
<style type="text/css" charset="utf-8">/* See license.txt for terms of usage */
/** reset styling **/
.firebugResetStyles {
z-index: 2147483646 !important;
top: 0 !important;
left: 0 !important;
display: block !important;
border: 0 none !important;
margin: 0 !important;
padding: 0 !important;
outline: 0 !important;
min-width: 0 !important;
max-width: none !important;
min-height: 0 !important;
max-height: none !important;
position: fixed !important;
-moz-transform: rotate(0deg) !important;
-moz-transform-origin: 50% 50% !important;
-moz-border-radius: 0 !important;
-moz-box-shadow: none !important;
background: transparent none !important;
pointer-events: none !important;
}
.firebugBlockBackgroundColor {
background-color: transparent !important;
}
.firebugResetStyles:before, .firebugResetStyles:after {
content: "" !important;
}
/**actual styling to be modified by firebug theme**/
.firebugCanvas {
display: none !important;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.firebugLayoutBox {
width: auto !important;
position: static !important;
}
.firebugLayoutBoxOffset {
opacity: 0.8 !important;
position: fixed !important;
}
.firebugLayoutLine {
opacity: 0.4 !important;
background-color: #000000 !important;
}
.firebugLayoutLineLeft, .firebugLayoutLineRight {
width: 1px !important;
height: 100% !important;
}
.firebugLayoutLineTop, .firebugLayoutLineBottom {
width: 100% !important;
height: 1px !important;
}
.firebugLayoutLineTop {
margin-top: -1px !important;
border-top: 1px solid #999999 !important;
}
.firebugLayoutLineRight {
border-right: 1px solid #999999 !important;
}
.firebugLayoutLineBottom {
border-bottom: 1px solid #999999 !important;
}
.firebugLayoutLineLeft {
margin-left: -1px !important;
border-left: 1px solid #999999 !important;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.firebugLayoutBoxParent {
border-top: 0 none !important;
border-right: 1px dashed #E00 !important;
border-bottom: 1px dashed #E00 !important;
border-left: 0 none !important;
position: fixed !important;
width: auto !important;
}
.firebugRuler{
position: absolute !important;
}
.firebugRulerH {
top: -15px !important;
left: 0 !important;
width: 100% !important;
height: 14px !important;
background: url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%13%88%00%00%00%0E%08%02%00%00%00L%25a%0A%00%00%00%04gAMA%00%00%D6%D8%D4OX2%00%00%00%19tEXtSoftware%00Adobe%20ImageReadyq%C9e%3C%00%00%04%F8IDATx%DA%EC%DD%D1n%E2%3A%00E%D1%80%F8%FF%EF%E2%AF2%95%D0D4%0E%C1%14%B0%8Fa-%E9%3E%CC%9C%87n%B9%81%A6W0%1C%A6i%9A%E7y%0As8%1CT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AATE9%FE%FCw%3E%9F%AF%2B%2F%BA%97%FDT%1D~K(%5C%9D%D5%EA%1B%5C%86%B5%A9%BDU%B5y%80%ED%AB*%03%FAV9%AB%E1%CEj%E7%82%EF%FB%18%BC%AEJ8%AB%FA'%D2%BEU9%D7U%ECc0%E1%A2r%5DynwVi%CFW%7F%BB%17%
jscroll_files.7z （10个子文件） 
jscroll_files 
s_bg2.gif 1KB
jscroll.js 7KB jquery.js 56KB
jscroll.html 33KB s_bg4.gif 2KB logo.gif 1KB 3417206.js 2KB s_bg.gif 1KB s_bg5.gif 2KB s_bg3.gif 1KB资源评论
yxgzhm2014-06-04还行，就是做的比较简单，但也蛮实用- s6sssdd2018-10-10蛮实用 附有资源图片
- kf539162012-12-06很好用，谢谢！
- itbbbt2012-10-28是原版，附有资源图片，效果不错
mackcyl
- 粉丝: 1
- 资源: 23
最新资源
- (源码)基于C语言的操作系统实验项目.zip
- (源码)基于C++的分布式设备配置文件管理系统.zip
- (源码)基于ESP8266和Arduino的HomeMatic水表读数系统.zip
- (源码)基于Django和OpenCV的智能车视频处理系统.zip
- (源码)基于ESP8266的WebDAV服务器与3D打印机管理系统.zip
- (源码)基于Nio实现的Mycat 2.0数据库代理系统.zip
- (源码)基于Java的高校学生就业管理系统.zip
- (源码)基于Spring Boot框架的博客系统.zip
- (源码)基于Spring Boot框架的博客管理系统.zip
- (源码)基于ESP8266和Blynk的IR设备控制系统.zip
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
