闲着无聊做一个jquery图片滚动插件
没事的时候研究了下jquery插件开发，就顺手写了点插件。未经过严谨额测试，权当玩玩......分为 两个方向的滚动：
首先引入jquery库：
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
上下方向：
http://seyaa.iteye.com/upload/picture/pic/89656/d69cb7af-c02b-3fcd-b1a8-3d14f364bdcc.png
引入js和css：
<link href="css/imgScoll-tm-1.0.css" rel="stylesheet" type="text/css"></link><script type="text/javascript" src="imgScoll-mt-1.0.js"></script>
如何使用：
<script type="text/javascript">$(function(){// 文档就绪$("#view").imgScoll({width:240,height:315,speed:10,delay:1000,direction:'mtt',data:{"totalCount" : 7,"result" : [{"src":'images/1.jpg',"describe":'test1test1test1',"href":'#'},{"src":'images/2.jpg',"describe":'test2test2test2',"href":'#'}, {"src":'images/3.jpg',"describe":'test3test3test3test3',"href":'#'}, {"src":'images/4.jpg',"describe":'4444444444',"href":'#'}, {"src":'images/5.jpg',"describe":'55555555555555',"href":'#'}, {"src":'images/6.jpg',"describe":'6666666666666',"href":'#'}, {"src":'images/1.jpg',"describe":'7777777777777',"href":'#'} ]}}); });</script><div id="view" ></div>
左右方向：
http://seyaa.iteye.com/upload/picture/pic/89654/f29863e1-c394-3bf4-a01b-f2afafcc3f36.png
引入js和css：
<link href="css/imgScoll-rl-1.0.css" rel="stylesheet" type="text/css"></link><script type="text/javascript" src="imgScoll-rl-1.0.js"></script>
如何使用：
<script type="text/javascript">$(function(){// 文档就绪$("#view").imgScoll({width:1002,height:263,speed:20,delay:1000,direction:'ltr',data:{"totalCount" : 7,"result" : [{"src":'images/1.jpg',"describe":'test1test1test1',"href":'#'},{"src":'images/2.jpg',"describe":'test2test2test2',"href":'#'}, {"src":'images/3.jpg',"describe":'test3test3test3test3',"href":'#'}, {"src":'images/4.jpg',"describe":'4444444444',"href":'#'}, {"src":'images/5.jpg',"describe":'55555555555555',"href":'#'}, {"src":'images/6.jpg',"describe":'6666666666666',"href":'#'}, {"src":'images/5.jpg',"describe":'7777777777777',"href":'#'} ]}}); var p = $("p:first");$("#view").scrollLeft(500);});</script><div id="view" ></div>
页:
[1]