2012-07-12 107 views
0

我創建了一個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... 

回答

0

您還沒有包裹你的腳本在任何JavaScript類(對象),所以你正在使用具有全局作用域(網頁級別)的所有變量。如果您嘗試多次使用它,我想你的變量會被覆蓋。

如果您發佈的你是如何試圖創建一個頁面多個幻燈片HTML標記,您可以得到更好的答案...

+0

謝謝Bhavesh! – user1215788 2012-07-14 06:14:43