<!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图片滚动插件(可向上，左右滚动）_111cn.net</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<script src="/demo/1/sildetab/jquery-1.2.6.pack.js" type="text/网页特效"></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>
源码下载地址
http://down.111cn.net/down/code/jquery/2010/0907/20678.html