html 文字上下滚动

内容摘要
这篇文章主要为大家详细介绍了html 文字上下滚动,具有一定的参考价值,可以用来参考一下。

经测试代码如下:

<!DOCTYPE html><html>
<head>
<meta charset="UTF-8
文章正文

这篇文章主要为大家详细介绍了html 文字上下滚动,具有一定的参考价值,可以用来参考一下。

经测试代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<code class="html">
<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
<div id="hdemo" style="height:200px;overflow:hidden;">
<div id="indemo" style="height:200%;">
<div id="hdemo1">
第一行字<br />
第二行字</div>
<div id="hdemo2"></div>
</div>
</div>
</body>
 
</body>
</html>
 
<!--   代码来自 php教程 (www.idcnote.com)--></code>
相关JS:经测试代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<code class="js">
<script type="text/javascript">
speed = 100; //数字越大滚得越慢
var htab = document.getElementById("hdemo");
var htab1 = document.getElementById("hdemo1");
var htab2 = document.getElementById("hdemo2");
htab2.innerHTML = htab1.innerHTML;
htab.scrollTop = htab1.offsetHeight;
function Marquee(){if (htab.scrollTop >= htab1.offsetHeight) {
htab.scrollTop-=htab2.offsetHeight;
}else{
htab.scrollTop+=1;
}
}var MyMar=setInterval(Marquee,speed);
</script>
 
// 来自:php教程(www.idcnote.com)
</code>

注:关于html 文字上下滚动的内容就先介绍到这里,更多相关文章的可以留意

代码注释

作者:喵哥笔记

IDC笔记

学的不仅是技术,更是梦想!