Tip: you can modify some code before running
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><ptml xmlns="http://www.w3.org/1999/xhtml"><pead><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>Eight images show focus</title><style type="text/css">Img {border: 1px solid #666666 ;}</style></pead><body><div class="aL"><div ><!--图片播放器Begin--><style>.imgBox{width:450px;height:300px;margin:4px auto auto;position:relative;}.imgBox .blackBox{bottom:0;left:0;width:100%;height:32px; background:#000;position:absolute;filter:alpha(opacity=40);opacity:0.6;z-index:100;}.imgBox .picImg{display:block;FILTER: revealTrans(duration=1,transition=23);}.imgBox .titleBox{bottom:0;left:0;width:100%;height:32px; position:absolute;z-index:300;color:#fff;line-height:16px; overflow:hidden;}.imgBox h1{text-align:center;margin-top:5px;}.imgBox h1 a,.imgBox h1 a:visited,.imgBox h1 a:hover{color:#fff;font-size:14px;}.imgBoxBtn{padding-top:6px;}.btnArea{float:left;}.btnArea .numArea{float:left; }.numArea a{float:left;width:16px;height:16px;font-size:10px;background:yun_qi_img/ss_cl_029.gif) no-repeat;text-align:center;margin-left:9px;color:#999;text-decoration:none;line-height:16px;font-family:"Arial","verdana"; }.numArea a:hover{text-decoration:none;}.numArea a.cur,numArea a.cur:hover{background:#000;color:#999;}.btnArea .playArea{float:right;width:92px;margin-top:8px;}.btnArea a.prv{float:left;width:16px;height:16px;margin-left:0px;background:yun_qi_img/ss_cl_029.gif) no-repeat 0 -100px; }.btnArea a.next{float:left;width:16px;height:16px;margin-left:0px;background:yun_qi_img/ss_cl_029.gif) no-repeat 0 -200px;margin-left:8px;display:inline;}a.pause{background:yun_qi_img/ss_cl_029.gif) 100% -300px no-repeat;padding-right:20px;line-height:16px; height:16px;text-align:center;display:block; float:right;overflow:hidden; color:#878787; text-decoration:none; }a.pause:hover, a.pause:active{ color:#ddd;}</style></style><div class="imgBox"><div class="titleBox" id="titleBox"><p id="titleArea">Text</p></div></div><div class="imgBoxBtn"><div class="btnArea"><div class="numArea" id="numLink">5 4 3 2 1</div><div class="clearit"></div></div>Pause playback</div><script language="javascript">//<![CDATA[var $=function(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval('document.all.'+objName)}}function picData(pTitle,pImgSrc,pUrl){this.title=pTitle;this.imgSrc=pImgSrc;this.http://www.111cn.net/js_a/76/url=pUrl;this.showTitle=picData_doTitle;}function picData_doTitle(){var titleHtml="";titleHtml=""+this.title+"";return titleHtml;}var picArr=new Array();//焦点图1picArr[0]=new picData();picArr[0].title="可爱小居";picArr[0].imgSrc="yun_qi_img/092236229163.gif";picArr[0].http://www.111cn.net/js_a/76/url="#";//焦点图2picArr[1]=new picData();picArr[1].title="沙发";picArr[1].imgSrc="yun_qi_img/";picArr[1].http://www.111cn.net/js_a/76/url="# ";//焦点图3picArr[2]=new picData();picArr[2].title="蓝色大床";picArr[2].imgSrc="yun_qi_img/";picArr[2].http://www.111cn.net/js_a/76/url="#";//焦点图4picArr[3]=new picData();picArr[3].title="红色沙发";picArr[3].imgSrc="yun_qi_img/092240042G3.jpg";picArr[3].http://www.111cn.net/js_a/76/url="#";//焦点图5picArr[4]=new picData();picArr[4].title="粉色空间";picArr[4].imgSrc="yun_qi_img/092245039101.jpg";picArr[4].http://www.111cn.net/js_a/76/url="#";//焦点图6picArr[5]=new picData();picArr[5].title="可爱宝宝";picArr[5].imgSrc="yun_qi_img/";picArr[5].http://www.111cn.net/js_a/76/url="#";//焦点图7picArr[6]=new picData();picArr[6].title="我来捕蝴蝶";picArr[6].imgSrc="yun_qi_img/";picArr[6].http://www.111cn.net/js_a/76/url="#";//焦点图8picArr[7]=new picData();picArr[7].title="古城";picArr[7].imgSrc="yun_qi_img/";picArr[7].http://www.111cn.net/js_a/76/url="#";//初始化开始var numHtml=""var curPicId=0;for(i=1;i<=picArr.length;i++){loadImg=new Image();loadImg.src=picArr[(i-1)].imgSrc;if(i==1)numHtml+=""+i+"";elsenumHtml+=""+i+"";}$('numLink').innerHTML=numHtml;$('picImg').src=picArr[0].imgSrc;$('picUrl').href=picArr[0].http://www.111cn.net/js_a/76/url;$("titleArea").innerHTML=picArr[0].showTitle();myPicTime=setInterval(autoPicPlay,5000);//初始化完成function doPic(picId){curPicId=picId;if($('picImg').filters){$('picImg').filters.revealTrans.Transition=23;$('picImg').filters.revealTrans.apply();$('picImg').filters.revealTrans.play();}$('picImg').src=picArr[picId].imgSrc;$('picUrl').href=picArr[picId].http://www.111cn.net/js_a/76/url;for(i=0;i<picArr.length;i++){$("picBtn"+i).className=$("picBtn"+i).className.replace('cur','');}$("picBtn"+picId).className+=" cur";$("picBtn"+picId).blur();$("titleArea").innerHTML=picArr[picId].showTitle();}var myPicTime;function clickPic(cId){ clearInterval(myPicTime); doPic(cId); myPicTime=setInterval(autoPicPlay,5000);}function autoPicPlay(playType)// -1 后退 +1前进{if(playType==0 || playType==null)playType=1;if(playType>0) {curPicId ++; if (curPicId> = picArr. length) {curPicId = 0 ;}} else {curPicId --; if (curPicId <0) curPicId = picArr. length-1;} doPic (curPicId);} function Pause () {clearInterval (myPicTime);} //]></script><!--图片播放器End--></div></div></body></ptml>
Tip: you can modify some code before running
