html文字上下滚动

内容摘要

这篇文章主要为大家详细介绍了html 文字上下滚动，可以用来参考一下。经测试代码如下：

文章正文

这篇文章主要为大家详细介绍了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>

相关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>

注：关于html 文字上下滚动的内容就先介绍到这里

代码注释

上一篇 html文字左右滚动代码下一篇 HTML中让上下两个div之间保持一定距离或没有距离

作者：喵哥笔记

学的不仅是技术，更是梦想！