function SlideBanner(obj){ this.bannerBox=obj; this.bannerList=$("ul li",obj); this.setImgBg(); var _this_=this; if(this.bannerList.size()>1){//当banner图数量大于1的时候才序列对应的按钮 this.t=null; this.t2=null; this.loop=0; this.btnDivBox=$(" "); this.addButtons(); this.autoPlay(); this.bannerBox.hover(function(){ window.clearInterval(_this_.t2); },function(){ _this_.autoPlay(); }); }; }; SlideBanner.prototype={ preLoadImg:function(url,callBack){//判断图片是否加载完成 var img=new Image(); if(!!window.ActiveXObject){ img.onreadystatechange=function(){ if(this.readyState=="complete"){ callBack(); }; }; }else{ img.οnlοad=function(){ callBack(); }; }; img.src=url; }, setImgBg:function(){//设置背景图片 var _this=this; this.bannerList.each(function(i,o){ //当背景图片载入完成后才设置到背景里面 _this.preLoadImg($(o).attr("data-img"),function(){ $(o).css("backgroundImage","url("+$(o).attr("data-img")+")"); }); }); }, addButtons:function(){ var _this=this,w=19*this.bannerList.size(); this.btnDivBox.width(w).css("marginLeft",-w/2+"px"); this.bannerList.each(function(i,o){ _this.btnDivBox.append(""); }); this.bannerBox.append(this.btnDivBox); this.btnDivBox.children().eq(0).addClass("current").end().mouseover(function(e){ e.stopPropagation(); var $this=this; _this.t=window.setTimeout(function(){ if(!$($this).hasClass("current")){ _this.changeStyle($this); }; },200); }).mouseout(function(){ window.clearTimeout(_this.t); }); }, changeStyle:function(thisObj){ var i=$(thisObj).index(); this.bannerList.hide().eq(i).fadeIn(); this.btnDivBox.children().eq(i).addClass("current").siblings().removeClass("current"); this.loop=i; }, autoPlay:function(){ var _this=this; this.t2=window.setInterval(function(){ if(_this.loop==_this.bannerList.size()-1){ _this.loop=-1; }; _this.loop++; _this.btnDivBox.children().eq(_this.loop).mouseover(); },5000); } };
$(function(){ var s=new SlideBanner($("#SlideBannerBox")); });