Javascript多个幻灯片

我创建了一个HTML文件，它使用java脚本来显示随机显示在3个div标签中的图像。点击图像向左或向右移动。它工作正常，直到我在页面中使用单个幻灯片，但当我在同一页上尝试多个幻灯片时会产生问题。Javascript多个幻灯片

这里是一个幻灯片放映代码：

**<script> 
currentIndx = 2; 

MyImages=new Array(); 

MyImages[0]='1images2.jpeg'; 

MyImages[1]='1images3.jpeg'; 

MyImages[2]='1images4.jpeg'; 

MyImages[3]='artwork.jpg'; 

MyImages[4]='1images5.jpeg'; 

imagesPreloaded = new Array(4) 

for (var i = 0; i < MyImages.length ; i++) 

{ 
imagesPreloaded[i] = new Image(120,120) 

imagesPreloaded[i].src=MyImages[i] 
} 

/* we create the functions to go forward and go back   */ 

function Nexter() 

{ 

if (currentIndx<MyImages.length-1){ 
alert(currentIndx); 
document.leftimg.src=document.middleimg.src 
document.middleimg.src=document.rightimg.src 
document.rightimg.src=imagesPreloaded[++currentIndx].src 

} 
else { 
alert("In nexter else") 
currentIndx=0 
document.leftimg.src = document.middleimg.src 

document.middleimg.src = document.rightimg.src 

document.rightimg.src = imagesPreloaded[currentIndx].src 

} 

writeImageNumber(); 

} 
function Backer() 
{ 
if (currentIndx>0) 
{ 

--currentIndx; 

alert("In Backer If"); 

document.rightimg.src=document.middleimg.src 

document.middleimg.src=document.leftimg.src 

document.leftimg.src=imagesPreloaded[currentIndx].src 

} 

else 
{ 


    currentIndx = MyImages.length-1 

    alert(MyImages.length +"else"); 

    document.rightimg.src = document.middleimg.src 

    document.middleimg.src = document.leftimg.src 

    document.leftimg.src = imagesPreloaded[currentIndx].src 

} 

writeImageNumber(); 

} 

/*###### function to reload the images and text when refresh is pressed ##### */ 

function setCurrentIndex() 
{ 
currentIndx=0; 

document.theImage.src=MyImages[0]; 

document.form1.text1.value=Messages[0]; 

writeImageNumber(); 

} 

</script> 

<body onload="setCurrentIndex();automaticly()"> 

<!-- start of form for image slide show ####################### --> 

<div id ="left" style="float:left"> 

<a href="#" onclick="Backer()" ><img src="1images2.jpeg" width="265" height="262" 
border="0" name="leftimg"></a> 
</div> 

<div id ="middle" style="float:left"> 

<a href="#" onclick=""><img src="1images3.jpeg" width="265" height="262" 
border="0" name="middleimg"></a> 
</div> 

<div id ="right" class="compimg" style="float:left"> 
<a href="#" onclick="Nexter()" ><img src="1images4.jpeg" 
width="265" height="262" alt="" border="0"name="rightimg"></a> 
</div> 

<!-- end of form for image slide show ####################### -->** 



Any suggestions...

来源

2012-07-12 user1215788

您还没有包裹你的脚本在任何JavaScript类（对象），所以你正在使用具有全局作用域（网页级别）的所有变量。如果您尝试多次使用它，我想你的变量会被覆盖。

如果您发布的你是如何试图创建一个页面多个幻灯片HTML标记，您可以得到更好的答案...

来源

2012-07-12 07:27:06 DexTer

谢谢Bhavesh！ – user1215788 2012-07-14 06:14:43

Javascript多个幻灯片

回答

相关问题