<!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>
<title>jQuery图片滚动_codesc.net</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://www.cssrain.cn/demo/1/SildeTab/jquery-1.2.6.pack.js" type="text/javascript"></script>
<script type="text/javascript" src="jquery.imageScroller.js"></script>
<style type="text/css">
#viewer {height:100px; width:300px; clear:both; overflow:hidden; border:3px solid #e5e5e5;}
#viewerFrame {width:505px; clear:both; padding:0;}
#viewer img {width:90px; height:90px; margin:5px; display:inline; border:0;}
#viewer a {display:block; float:left; width:100px; height:100px;}
</style>
<script type="text/javascript">
$(function(){
$("#viewer").imageScroller({
next:"btn1",
prev:"btn2",
frame:"viewerFrame",
width:100,
child: "a",
auto: true
});
});
</script>
</head>
<body>
<div id="viewer">
<div id="viewerFrame">
<a href=""><img src="img/pre1.jpg"></a>
<a href=""><img src="img/pre2.jpg"></a>
<a href=""><img src="img/pre3.jpg"></a>
<a href=""><img src="img/pre4.jpg"></a>
<a href=""><img src="img/pre5.jpg"></a>
</div>
</div>
<span id="btn1">向前</span>
<br/>
<span id="btn2">向后</span>
</body>
</html>
imageScroller_脚本实例_源码
版权申诉
68 浏览量
2021-10-04
01:04:57
上传
评论
收藏 40KB RAR 举报
imageScroller.rar （7个子文件） 
codesc.net jQuery-imageScroller img 
pre1.jpg 6KB pre3.jpg 12KB pre4.jpg 9KB pre5.jpg 5KB pre2.jpg 7KB
imageScroller.html 1KB
jquery.imageScroller.js 3KB资源评论
