日期:2014-05-16  浏览次数:20336 次

帮写一段代码鼠标放上去停止切换的
本帖最后由 cctv361 于 2013-03-21 15:57:56 编辑
下面是一个JS控制的图片切换,也叫幻灯片和焦点图吧,现在想实现鼠标放上去图片停止切换,拿开时再自动切换,请帮写上段这样的代码,谢谢
网页中调用<div id="slideshow"><script type="text/javascript">
var box =new PPTBox();box.width=970; box.height=272;box.autoplayer=5;
box.add({"url":"images/1.jpg","href":"/","title":"悬浮提示标题1"})
box.show();</script></div>


JS代码如下:
function PPTBox(){this.uid=PPTBoxHelper.getId();PPTBoxHelper.instance[this.uid]=this;this._$=function(id){return document.getElementById(id)};this.width=400;this.height=300;this.picWidth=15;this.picHeight=12;this.autoplayer=4;this.target="_blank";this._box=[];this._curIndex=0};PPTBox.prototype={_createMainBox:function(){var flashBoxWidth=this.width*this._box.length+5;var html="<div id='"+this.uid+"_mainbox' class='mainbox'  style='width:"+(this.width)+"px;height:"+(this.height+2)+"px;'>";html+="<div id='"+this.uid+"_flashbox' class='flashbox' style='width:"+flashBoxWidth+"px;height:"+(this.height+2)+"px;'></div>";html+="<div id='"+this.uid+"_imagebox' class='imagebox' style='width:"+this.width+"px;height:"+(this.picHeight+2)+"px;top:-"+(this.picHeight+20)+"px;'></div>";html+="</div>";document.write(html)},_init:function(){var picstyle="";var eventstr="PPTBoxHelper.instance['"+this.uid+"']";var imageHTML="";var flashbox="";for(var i=0;i<this._box.length;i++){var parame=this._box[i];flashbox+=this.flashHTML(parame.url,this.width,this.height,i);imageHTML="<div class='bitdiv "+((i==0)?"curimg":"defimg")+"' title ="+parame.title+" src='bit01.gif' "+picstyle+" onclick = \""+eventstr+".clickPic("+i+")\"  onmouseover=\""+eventstr+".mouseoverPic("+i+")\"></div>"+imageHTML};this._$(this.uid+"_flashbox").innerHTML=flashbox;this._$(this.uid+"_imagebox").innerHTML=imageHTML},_play:function(){clearInterval(this._autoplay);var idx=this._curIndex+1;if(idx>=this._box.length){idx=0};this.changeIndex(idx);var eventstr="PPTBoxHelper.instance['"+this.uid+"']._play()";this._autoplay=setInterval(eventstr,this.autoplayer*1000)},flashHTML:function(url,width,height,idx){var isFlash=url.substring(url.lastIndexOf('.')+1).toLowerCase()=="swf";var html="";if(isFlash){html="<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' "+"codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='"+width+"' height='"+height+"'>"+"<param name=\"movie\" value=\""+url+"\" />"+"<param name='quality' value='high' />"+"<param name='wmode' value='transparent'>"+"<embed src='"+url+"' quality='high' wmode='opaque' pluginspage='http://www.macromedia.com/go/getflashplayer'"+"  type='application/x-shockwave-flash' width="+width+" height='"+height+"'></embed>"+"  </object>"}else{var eventstr="PPTBoxHelper.instance['"+this.uid+"']";var style="";if(this._box[idx].href){style="cursor:pointer"};html="<img src='"+url+"' style='width:"+width+"px;height:"+height+"px;"+style+"' onclick = \""+eventstr+".clickPic("+idx+")\"/>"};return html},changeIndex:function(idx){var parame=this._box[idx];moveElement(this.uid+"_flashbox",-(idx*this.width),1);var imgs=this._$(this.uid+"_imagebox").getElementsByTagName("div");imgs[this._box.length-1-this._curIndex].className="bitdiv defimg";imgs[this._box.length-1-idx].className="bitdiv curimg";this._curIndex=idx},mouseoverPic:function(idx){this.changeIndex(idx);if(this.autoplayer>0){clearInterval(this._autoplay);var eventstr="PPTBoxHelper.instance['"+this.uid+"']._p