jquery插件 - imageScroller

来源：互联网发布：医生用药app软件编辑：程序博客网时间：2024/06/06 01:16

效果还不错，值得使用。

演示：

http://cssrain.cn/demo/jQuery-imageScroller/imageScroller.html

下载：

http://cssrain.cn/demo/jQuery-imageScroller/imageScroller.rar

本篇文章来源于 cssrain.cn 原文链接：http://www.cssrain.cn/article.asp?id=1301

<!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></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="http://cssrain.cn/demo/jQuery-imageScroller/img/pre1.jpg"></a>      <a href=""><img src="http://cssrain.cn/demo/jQuery-imageScroller/img/pre2.jpg"></a>      <a href=""><img src="http://cssrain.cn/demo/jQuery-imageScroller/img/pre3.jpg"></a>      <a href=""><img src="http://cssrain.cn/demo/jQuery-imageScroller/img/pre4.jpg"></a>      <a href=""><img src="http://cssrain.cn/demo/jQuery-imageScroller/img/pre5.jpg"></a> </div></div><span id="btn1">向前</span><br/><span id="btn2">向后</span></body></html>