經常看到一些網站中有控制著多幅圖片上下移動滾動的效果,本站也整理了一個,供大家參考。
其基本思想是使用對象的scrollTop方法,詳細代碼如下,將下面代碼放在<body>和</body>之間即可
<a href="javascript: void(0);" onmouseover="ScrollDivUp_T=setInterval(ScrollDivUp,10);" onmouseout="clearInterval(ScrollDivUp_T)">向上滾動</a>
<div id="items" style="margin:5px 0px 5px 0px;width:675px;height:170px;border:1px solid #dddddd;overflow:hidden">
<img src="images/logo1.gif" alt="圖片1" /><br />
<img src="images/logo2.gif" alt="圖片2" /><br />
<img src="images/logo3.gif" alt="圖片3" /><br />
<img src="images/logo4.gif" alt="圖片4" /><br />
<img src="images/logo5.gif" alt="圖片5" />
</div>
<a href="javascript: void(0);" onmouseover="ScrollDivDown_T=setInterval(ScrollDivDown,10);" onmouseout="clearInterval(ScrollDivDown_T)">向下移動</a>
<script language="javascript">
function ScrollDivUp(){document.getElementById('items').scrollTop -= 1;}
function ScrollDivDown(){document.getElementById('items').scrollTop += 1;}
</script>
新聞熱點
疑難解答