為什么這樣可以實現字幕滾動效果呢
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<style type="text/css">
#d{position:absolute;background-color:#eee;left:100px;top:100px;}
#d div{font-size:25px;magin:5px;}
</style>
<script type="text/javascript">
function body_onload(){
var handle=setInterval(myfun,500);
var d=document.getElementById("d");
function myfun(){
d.appendChild(d.firstChild);
}
}
</script>
</head>
<body onload="body_onload()">
<div id="d">
? ? <div>我是字幕1</div>
? ? ? ? <div>我是字幕2</div>
? ? ? ? <div>我是字幕3</div>
? ? ? ? <div>我是字幕4</div>
? ? </div>
</body>
</html>
2018-04-06
話說怎么讓他們橫著流動？
2015-06-29
打一個簡單的比喻,把這四個字幕div當作釣魚的浮袍(把第一個取掉之后,后面的會浮上來).d.appendChild(d.firstChild)相當于把第一個元素,插到隊尾,隊列第二個元素迅速成為第一個元素,如此循環.不過此代碼還不夠完善,需要過濾掉非element子節點.對dom操作或dom節點不熟悉,建議網上找找<<Javascript權威指南(6th)>>或<<JavaScript高級程序設計(2-3th)>>看一下.