位置：71code站长站 → 站长学习 → 网站开发 → JavaS、VbS → 横向不间断连续滚动图片效果

横向不间断连续滚动图片效果

减小字体

增大字体作者：Ahaoz.CoM 来源：本站整理发布时间：2006-4-25 9:26:39

　　上次我们介绍不间断连续图片滚动效果的制作方法，感觉交不是太完美：无法实现超链接。查询相关资料，解决横向不间断滚动的图片效果，而且还能实现超链接。
　　制作方法：
　　１、在<head>中加入代码：
<script language="JavaScript">
imgArr=new Array()
imgArr[0]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592639456.gif border=0></a>"
imgArr[1]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592639311.gif border=0></a>"
imgArr[2]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592640843.gif border=0></a>"
imgArr[3]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592641133.gif border=0></a>"
imgArr[4]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592641534.gif border=0></a>"
imgArr[5]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592641492.gif border=0></a>"
imgArr[6]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592641839.gif border=0></a>"
imgArr[7]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592642271.gif border=0></a>"
imgArr[8]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592642433.gif border=0></a>"
imgArr[9]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592642605.gif border=0></a>"
imgArr[10]="<a href=Javascript:; onmouseMove='javascript:outHover=true' ><img src=/Article/UploadPic/2006-4/200642592642424.gif border=0></a>"
var moveStep=4 //步长，单位：pixel
var moveRelax=100 //移动时间间隔，单位：ms

ns4=(document.layers)?true:false

var displayImgAmount=5 //视区窗口可显示个数
var divWidth=88 //每块图片占位宽
var divHeight=31 //每块图片占位高

var startDnum=0
var nextDnum=startDnum+displayImgAmount
var timeID
var outHover=false

var startDivClipLeft
var nextDivClipRight

function initDivPlace(){
if (ns4){
for (i=0;i<displayImgAmount;i++){
eval("document.divOuter.document.divAds"+i+".left="+divWidth*i)
}
for (i=displayImgAmount;i<imgArr.length;i++){
eval("document.divOuter.document.divAds"+i+".left="+divWidth*displayImgAmount)
}
}else{
for (i=0;i<displayImgAmount;i++){
eval("document.all.divAds"+i+".style.left="+divWidth*i)
}
for (i=displayImgAmount;i<imgArr.length;i++){
eval("document.all.divAds"+i+".style.left="+divWidth*displayImgAmount)
}
}
}

function mvStart(){
timeID=setTimeout(moveLeftDiv,moveRelax)
}

function mvStop(){
clearTimeout(timeID)
}

function moveLeftDiv(){
if (ns4){
for (i=0;i<=displayImgAmount;i++){
eval("document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left=document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left-moveStep")
}

startDivClipLeft=parseInt(eval("document.divOuter.document.divAds"+startDnum+".clip.left"))
nextDivClipRight=parseInt(eval("document.divOuter.document.divAds"+nextDnum+".clip.right"))

if (startDivClipLeft+moveStep>divWidth){
eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+divWidth)

eval("document.divOuter.document.divAds"+startDnum+".left="+divWidth*displayImgAmount)
eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".left=document.divOuter.document.divAds"+nextDnum+".left+"+divWidth)
eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".clip.left=0")

startDnum=(++startDnum)%imgArr.length
nextDnum=(startDnum+displayImgAmount)%imgArr.length

startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
}else{
eval("document.divOuter.document.divAds"+nextDnum+".clip.left=0")
startDivClipLeft+=moveStep
nextDivClipRight+=moveStep
}
eval("document.divOuter.document.divAds"+startDnum+".clip.left="+startDivClipLeft)
eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+nextDivClipRight)
}else{
for (i=0;i<=displayImgAmount;i++){
eval("document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.left=document.all.divAds"+parseI

[1] [2] 下一页

[] [返回上一页] [打印]