1

私は Javascript の初心者で、小さな問題に直面しています。ページが読み込まれるとすぐに、5 つの div の可視性を回転させようとしています。現在、各画像ボタンにカーソルを合わせた後にのみ回転を開始します。ありがとうございました！

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

<!--

function toggleDiv(id,flagit) {

if (flagit=="1"){

if (document.layers) document.layers[''+id+''].visibility = "show"

else if (document.all) document.all[''+id+''].style.visibility = "visible"

else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "visible"

}

}

</script>



</head>

<body>

<script type="text/javascript">

if (document.all || document.getElementById){ //if IE4 or NS6+
document.write('<style type="text/css">\n')
document.write('.dyncontent{width: 250px; height: 60px;}\n')
document.write('</style>')
}

var curcontentindex=0
var messages=new Array()

function rotatecontent(){
curcontentindex=(curcontentindex<messages.length-1)? curcontentindex+1 : 0
prevcontentindex=(curcontentindex==0)? messages.length-1 : curcontentindex-1
messages[prevcontentindex].style.display="none" 
messages[curcontentindex].style.display="block" 
}


window.onload=function(){
if (document.all || document.getElementById){
getElementByClass("dyncontent")
setInterval("rotatecontent()", 1000)
}
}


</script>

<a href="#" onMouseOver="toggleDiv('div1',1)" onMouseOut="toggleDiv('div1',0)" ><img     src="Images/BAB.com_web_link_10.jpg" width="250" height="100"     STYLE="position:absolute; TOP:0px; LEFT:400px;"></a>
<a href="#" onMouseOver="toggleDiv('div2',1)" onMouseOut="toggleDiv('div2',0)"><img     src="Images/SLU_on_the_Road.jpg" width="250"     height="100" STYLE="position:absolute; TOP:100px; LEFT:400px;"></a>
<a href="#" onMouseOver="toggleDiv('div3',1)" onMouseOut="toggleDiv('div3',0)"><img     src="Images/Billiken_Blogs.jpg" width="250"     height="100" STYLE="position:absolute; TOP:200px; LEFT:400px;"></a>
<a href="#" onMouseOver="toggleDiv('div4',1)" onMouseOut="toggleDiv('div4',0)"><img     src="Images/SLU_Chat.jpg" width="250"     height="100" STYLE="position:absolute; TOP:300px; LEFT:400px;"></a>
<a href="#" onMouseOver="toggleDiv('div5',1)" onMouseOut="toggleDiv('div5',0)"><img     src="Images/Viewbook_Button_2011.jpg"     width="250" height="100" STYLE="position:absolute; TOP:400px; LEFT:400px;"></a>
<p class="desc">

<div class="dyncontent"><div id="div1">Div 1/div></div>

<div class="dyncontent"><div id="div2">Div 2</div></div>

<div class="dyncontent"><div id="div3">Div 3</div></div>

<div class="dyncontent"><div id="div4">Div 4</div></div>

<div class="dyncontent"><div id="div5">Div 5</div></div>

</p>

</body>
</html>
4

2 に答える 2

1

ほとんどの JavaScript では、行末にセミコロンが必要です。JSLint などのリンターを介して実行し、他のエラーを見つけます。また、window.addEventListener('load',rotateContent,false);代わりに使用してみてくださいwindow.onload=rotateContent

于 2012-07-02T14:56:40.733 に答える
0 
$(document).ready(function() {

  // code within ready() will execute
  // after page load

  rotatecontent();

});
于 2012-07-02T14:53:59.027 に答える