如上面的示范，可轮流展示全部12张图像之中的6张。鼠标接触时会暂停，每张图像可用作不同路径的链接。 安装 步骤一 拷贝以下脚本後贴在有关网页的<head></head>之间。 <script language="javascript"> <!-- shuju=new Array() shuju[0]=new Array("shu.gif","1.html") shuju[1]=new Array("niu.gif","2.html") shuju[2]=new Array("hu.gif","3.html") shuju[3]=new Array("tu.gif","4.html") shuju[4]=new Array("long.gif","5.html") shuju[5]=new Array("she.gif","6.html") shuju[6]=new Array("ma.gif","6.html") shuju[7]=new Array("yang.gif","6.html") shuju[8]=new Array("hou.gif","6.html") shuju[9]=new Array("ji.gif","6.html") shuju[10]=new Array("gou.gif","6.html") shuju[11]=new Array("zhu.gif","6.html") tu_shumu=6 // 展区里展示的图像数目 tu_daxiao=100 // 图像大小，必须是正方形 tu_juli=0 // 图像间的距离 quanbu_yidong=1 // 0 = 只呈现符合展区图像数目的图像 // 1 = 展示所有列入的图像 // 若上列选择为0，则设定以下开始与末尾的图像序号 tou_tu_hao=1 // 开始图像序号 wei_tu_hao=5 // 末尾图像序号 zhanqu_bianjie=6 //展区边界宽度 bianjie_yangshi="inset" //边界样式 bianjie_yanse="#FFFFFF" //边界颜色 zhanqu_dise="#025B75" // 图像间隔处的颜色 zhanqu_diduan=180 // 展区与屏幕顶端距离 zhanqu_juzhong=1 // 是否居中？0 = 否 1 =是。若选择0，则设定下一行。 zhanqu_zuoduan=100 // 若不选择居中，应设定展区与屏幕左端距离 yidong_sudu=1 // 设定图像移动速度 //以下免动 tou_tu_hao-- wei_tu_hao-- if(tou_tu_hao== -1){ tou_tu_hao=0 } if(wei_tu_hao>shuju.length-1){ wei_tu_hao=shuju.length-1 } zhanqu_kuandu=(tu_shumu*tu_daxiao)+(tu_shumu*tu_juli) initpos=new Array() nowdivpos=new Array() next_right="" nextpic=tou_tu_hao run_rate=10 function init(){ if(quanbu_yidong==1){ nextpic=0 } document.write("<div id=\"display\" style=\"position:absolute; left:"+zhanqu_zuoduan+"; top:"+zhanqu_diduan+"; width:"+(zhanqu_kuandu+zhanqu_bianjie*2)+"px; height:"+(tu_daxiao+zhanqu_bianjie*2)+"px; border:"+zhanqu_bianjie+"px "+bianjie_yangshi+" "+bianjie_yanse+";background-color:"+zhanqu_dise+"\">") if(zhanqu_juzhong==1){ document.getElementById("display").style.left=(document.body.clientWidth/2)-(document.getElementById("display").offsetWidth/2) } document.write("<div id=\"center_div\" style=\"position:absolute; left:0; top:0; width:"+zhanqu_kuandu+"px; height:"+tu_daxiao+"px; clip:rect(0,"+zhanqu_kuandu+","+tu_daxiao+",0)\" onmouseover=\"stopme()\" onmouseout=\"move_right()\">") for(i=0;i<tu_shumu+1;i++){ document.write("<div id=\"div_"+[i]+"\" style=\"position:absolute\">") document.write("<a id=\"loc"+[i]+"\" href=\"\" onclick=\"newwin(this.location);return false\"><img src=\"\" id=\"pic_"+[i]+"\" width="+tu_daxiao+" height="+tu_daxiao+" alt=\"多图幻灯\" border=\"0\"></a></div>") } document.write("</div>") document.write("</div>") el_center=document.getElementById("center_div") elpos=-document.getElementById("pic_0").width//parseInt(el_center.style.width)-document.getElementById("pic_0").width for(i=0;i<tu_shumu+1;i++){ elpos+=(document.getElementById("pic_0").width)+tu_juli initpos[i]=elpos document.getElementById("div_"+[i]).style.left=initpos[i] if(quanbu_yidong==0&&nextpic>wei_tu_hao){ nextpic=tou_tu_hao document.getElementById("loc"+[i]).location=shuju[nextpic][1] document.getElementById("pic_"+[i]).src=shuju[nextpic++][0] } else{ document.getElementById("loc"+[i]).location=shuju[nextpic][1] document.getElementById("pic_"+[i]).src=shuju[nextpic++][0] } } move_right() } function move_right(){ for(i=0;i<tu_shumu+1;i++){ nowdivpos[i]=parseInt(document.getElementById("div_"+i).style.left) nowdivpos[i]-=yidong_sudu if(nowdivpos[i]<= -document.getElementById("pic_0").width){ document.getElementById("div_"+[i]).style.left=parseInt(el_center.style.width)+tu_juli if(quanbu_yidong==0&&nextpic>wei_tu_hao){ nextpic=tou_tu_hao document.getElementById("loc"+[i]).location=shuju[nextpic][1] document.getElementById("pic_"+[i]).src=shuju[nextpic++][0] } else{ if(nextpic>shuju.length-1){ nextpic=0 } document.getElementById("loc"+[i]).location=shuju[nextpic][1] document.getElementById("pic_"+[i]).src=shuju[nextpic++][0] } } else{ document.getElementById("div_"+[i]).style.left=nowdivpos[i] } } next_right=setTimeout("move_right()",run_rate) } function stopme(){ clearTimeout(next_right) } function newwin(loc){ if(loc==""){return} //window.open(loc) window.open(loc,'','left=200,top=200,width=200,height=200') } // --> </script> 步骤二 拷贝以下脚本贴在网页最靠近<body>之下。 <script>init()</script>
步骤一 拷贝以下脚本後贴在有关网页的<head></head>之间。
步骤二 拷贝以下脚本贴在网页最靠近<body>之下。
<script>init()</script>