用jquery自持的一款图片幻灯片

用jquery自制的一款图片幻灯片

最近在研究javascript，闲来无事，弄了个js的图片幻灯片，这里高人多多，在下就自讨没趣，献丑了

//定义结构//url:图片地址，link：链接地址，time：间隔时间，target：链接方式var picss=[{url:'http://img08.taobaocdn.com/bao/uploaded/i8/T132JHXoNGXXb8_w73_050214.jpg',link:'http://s.click.taobao.com/t_8?e=7HZ6jHSTb0FvNGBTwZ3oxzBmdv8h%2B%2FprH6BJMj8qtqGgbLzAVvw28JzlzH3NjXPbRQcI2oLyrlk2c6j5gA%3D%3D&c=dcb7de581b878042fe64d499e3aa159a&p=mm_14565610_0_0&n=19&u=12032832',time:3000,title:'特价M157 换季清仓夏装女装淑女高腰碎花朵波西米亚雪纺连衣裙子',target:'_blank'},{url:'http://img07.taobaocdn.com/bao/uploaded/i7/T13JRGXflkXXaK0tLa_090547.jpg',link:'http://s.click.taobao.com/t_8?e=7HZ6jHSTaEmStlBP7HKjlN1GMl0awBs4Cf6smIhVyQzKnhjbW5xAzhxHRqZPmkho4Jg%2BkzwV5dY8V%2FHJdvM%3D&c=f4d6b28b84cc994ccf0c16fd0602cf7f&p=mm_14565610_0_0&n=19&u=12032832',time:3000,title:'冲皇冠~韩版日式米娜夏装新款淑女气质百搭雪纺中袖连衣裙子640',target:'_blank'},{url:'http://img02.taobaocdn.com/bao/uploaded/i2/T1T1xIXlXEXXXvHEs__111009.jpg',link:'http://s.click.taobao.com/t_8?e=7HZ6jHSTaEEbaPpRyPwAW8sFDS%2Bw0xsvs7AM0BsDmAi7XD9yWleguM7b3%2FLHnOorrY1%2BLl2OIedeOS8gTQ%3D%3D&c=5be3107fc12694693615ec2d3e861201&p=mm_14565610_0_0&n=19&u=12032832',time:3000,title:'赔本赚吆喝!雪纺连衣裙舒服的日本天丝面料带腰带有大码附实物图',target:'_blank'},{url:'http://img01.taobaocdn.com/bao/uploaded/i1/T1W9BHXk4SXXba1Mg4_052736.jpg',link:'http://s.click.taobao.com/t_8?e=7HZ6jHSTbIKkXSg%2BywUJqXdrDFL%2FB74NdN%2B7H6IDG9SjiI%2FLfdVkiGMMhhIHLM9g44qaRhUDy9rAGg%3D%3D&c=7e7f82f848fa4dd200b27f60c9988965&p=mm_14565610_0_0&n=19&u=12032832',time:3000,title:'SS934#【五皇冠七十二变时尚屋】韩版2010夏装潮人短袖T恤',target:'_blank'}]//构造函数var Jsplayer=function(id,pics,w,h){this.id=id;this.pics=pics;this.width=w;this.height=h;this.index=0;this.preimg=null;}Jsplayer.prototype.createFlash=function(){var self=this;h=self.height;w=self.width;pics=self.pics;var player=$("#"+self.id);var images=[];//存储图片player.append("<div id='playercontent'></div>");player.css("height",h+"px").css("width",w+"px").css("border","1px solid #F27B04");//生成图片for(var i=0;i<this.pics.length;i++){var imga=$("<a href='"+this.pics[i].link+"' title='"+this.pics[i].title+"' target='"+this.pics[i].target+"'></a>");img=$("<img src='"+this.pics[i].url+"' alt='"+this.pics[i].title+"'/>").css("width",w+"px").css("height",h+"px");imga.append(img).css("z-index",i).hide();images[i]=imga;$("#playercontent").append(imga);}//根据player层定位按钮区playeroffset=player.offset();player.append('<div id="picbtn" style="position:absolute;top:'+(playeroffset.top+h-25)+'px;left:'+(playeroffset.left+parseInt(3*w/4))+'px;width:'+parseInt(w/4)+'px;height:20px;z-index:10000;"></div>');//根据player层定位标题区  标题：按钮=3：1player.append('<div id="titles" style="position:absolute;top:'+(playeroffset.top+h-25)+'px;left:'+playeroffset.left+'px;width:'+parseInt(3*w/4)+'px;height:20px;z-index:10000;"></div>');$("#picbtn").append('<div id="picbtns" style="float:right; padding-right:1px;"></div>');//生成按钮for(i=0;i<this.pics.length;i++){$("#picbtns").append('<span id="'+i+'" class="playera">&nbsp;'+(i+1)+'&nbsp;</span>&nbsp;');}//images[0].fadeIn("slow");self.preimg=images[0];//存储前一图片var timer=null;//即时器var prebtn=$("#picbtns #0");//存储前一按钮//点击事件$("#picbtns .playera").click(function(){id=this.id;prebtn.removeClass("playeraselected");prebtn=$(this).addClass("playeraselected");self.preimg.hide();images[id].fadeIn("slow");$("#titles").html(pics[id].title);self.preimg=images[id];clearTimeout(timer);timer=setTimeout(function(){nextid=parseInt(id)+1;if(nextid>images.length-1){nextid=0;}$("#picbtns #"+nextid).click();},pics[id].time);});$("#picbtns #0").click();};function getCurrentTimeSeconds(){var d=new Date();var hour=d.getHours();var minute=d.getMinutes();var seconds=d.getSeconds();return hour*60*60+minute*60+seconds;}aplayer=new Jsplayer("myplayer",picss,400,400);aplayer.createFlash();

?