Javascript，jQuery-在頁面加載時旋轉div

Question

我是Java語言的初學者，遇到了一個小問題。 我正在嘗試讓我的五個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>

Answer 1

您的大多數JavaScript在行尾都需要分號。 通過像JSLint這樣的linter運行它，以查找任何其他錯誤。 另外，嘗試使用window.addEventListener('load',rotateContent,false); 而不是window.onload=rotateContent

Answer 2

$(document).ready(function() {

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

  rotatecontent();

});

Javascript，jQuery-在頁面加載時旋轉div

問題描述

2 個解決方案

解決方案1
1 2012-07-02 14:56:40

解決方案2
0 2012-07-02 14:53:59

Javascript，jQuery-在頁面加載時旋轉div

問題描述

2 個解決方案

解決方案1 1 2012-07-02 14:56:40

解決方案2 0 2012-07-02 14:53:59

解決方案1
1 2012-07-02 14:56:40

解決方案2
0 2012-07-02 14:53:59