javascript 實現滾動效果代碼整理

2024-05-06 14:11:02

字體：大中小

來源：轉載

供稿：網友

1.先寫兩個最常用最簡潔的滾動代碼
代碼如下：
水平滾動：
<marquee direction="left" align="bottom" height="25" width="100%" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" scrolldelay="1">水平滾動字幕內容</marquee>
垂直滾動：
<marquee direction="up" height="200" onmouseout="this.start()" onmouseover="this.stop()" scrollAmount="1" scrollDelay="1">垂直滾動字內容</marquee>
2.平穩不間斷滾動
代碼如下:
<SCRIPT LANGUAGE="JavaScript">
var tm=null
function newsScroll() {
var scrollimg=document.getElementById("scroll")
if(scrollimg.parentNode.scrollTop!=(scrollimg.clientHeight/2))
scrollimg.parentNode.scrollTop++;
else
scrollimg.parentNode.scrollTop=0
}
window.onload=function() {
tm=setInterval('newsScroll()',25)
}
function stop()
{
clearInterval(tm)
}
function start()
{
tm=setInterval('newsScroll()',25)
}
</SCRIPT>
/* stop() start() 不能和調用ID在同一個容器內，如容器沒默認高度要制定高度*/

3 有停留滾動
代碼示例：

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]
4:一個簡單的滾動代碼學習制作示例

上一篇：js獲取數組任意個不重復的隨機數組元素原創

下一篇：jQuery 學習入門篇附實例代碼