jquery图片播放代码(jsm_pics08_0.1)[图]
本段代码由jsm官方博客发布，本篇文章用于描述源码内容。下载地址在官方博客：http://www.cnblogs.com/jsmblog/archive/2012/04/02/2430127.html
http://pic002.cnblogs.com/images/2012/388749/2012040217370517.png
代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><SCRIPT type="text/javascript" src="jquery.js"></SCRIPT> <style type="text/css">#jsm_pic08show ul{margin:0px;padding:0px;list-style-type:none;}#jsm_pic08show img{border:0px;}#jsm_pic08show{overflow:hidden;zoom:1;}#jsm_pic08show .pics img,#jsm_pic08show .pics,#jsm_pic08show .pics ul{width:490px;height:170px;}#jsm_pic08show .pics li{position:absolute;}#jsm_pic08show ul{position:absolute;overflow:hidden;}</style></head><body><script type="text/javascript">//0801jQuery.fn.jsm_pic08=function(){var _this=this;this.extend({pic_len:0,pic_i:-1,timetout:null,w:0,next:function(){_this.turnto(_this.pic_i+1);},pre:function(){_this.turnto(_this.pic_i-1);},turnto:function(i){var old_i=_this.pic_i;if(_this.timetout!=null){clearTimeout(_this.timetout);_this.timetout=null;}if(_this.pic_i>=_this.pic_len-1){_this.pic_i=0;}else if(i<0){_this.pic_i=_this.pic_len-1;}else{_this.pic_i=i;}var lis=$('.pics li',_this);$('.jsm_pic08_num',_this).html((_this.pic_i+1)+'/'+(_this.pic_len));if(old_i==-1){$(lis).css('z-index',0).css('left','0px');_this.timetout=setTimeout(_this.next,3000);}else{$(lis).css('z-index',1).css('left','0px');$(lis).css('z-index',0).css('left','0px');$(lis).animate({left:'-'+_this.w+'px'},200,function(){_this.timetout=setTimeout(_this.next,3000);});}//_this.timetout=setTimeout(_this.next,3000);}});this.pic_len=$('ul li',this).length;this.w=$('.pics img',this).width();$('.pics li').css('left','-'+this.w+'px');this.turnto(0);$('.jsm_pic08_pre_link',this).click(this.pre);$('.jsm_pic08_next_link',this).click(this.next);};$(window).ready(function(){$('#jsm_pic08show').jsm_pic08();});</script><div id="jsm_pic08show"><div class="links"><span class="jsm_pic08_num">1/1</span><a href="javascript:void(0);" class="jsm_pic08_pre_link">&lt;</a>&nbsp;&nbsp;<a class="jsm_pic08_next_link" href="javascript:void(0);" >&gt;</a> </div><div class="pics"><ul><li><a href="#1"><img src="1.png"/></a></li><li><a href="#2"><img src="2.jpg"/></a></li><li><a href="#3"><img src="3.jpg"/></a></li></ul></div></div></body></html>
页:
[1]