消息
创作中心
shielder_li 2021-07-06 17:46 采纳率: 100%
浏览 43
已采纳

html文本一个个显示并不断上移

我的字一个个显示了，但字多的话得自己往下翻，想让他自己不断上移

img

  • 写回答

1条回答 默认 最新

  • CSDN专家-天际的海浪 2021-07-06 17:59
    关注

    div设置overflow: hidden 或者 auto; 和height: 500px;

    然后每次更新显示后执行
    txt.scrollTop = txt.scrollHeight;
    让滚动条到最底。

    如果是要整个页面的滚动条到最底，可以用。
    var root = document.compatMode=="CSS1Compat" ? document.documentElement : document.body;
    root.scrollTop = root.scrollHeight;

    代码如下：（如有帮助，望采纳！谢谢! 点击我这个回答右上方的【采纳】按钮）

    <!doctype html>
<html>
<head>
    <meta charset="UTF-8" />
    <title> 页面名称 </title>
<script type="text/javascript">
var i = 0;
var content = "文本内容1 文本内容2 文本内容3 文本内容4 文本内容5 文本内容6 文本内容7 文本内容8 文本内容9 文本内容10 文本内容11 文本内容12 文本内容13 文本内容14 文本内容15 文本内容16 文本内容17 文本内容18 文本内容19 文本内容20";
function show() {
    var txt = document.getElementById("txt");
    txt.innerText = content.substr(0,i);
    var root = document.compatMode=="CSS1Compat" ? document.documentElement : document.body;
    root.scrollTop = root.scrollHeight;
    i++;
    if (i<=content.length) {
        setTimeout("show()", 300);
    }
}
</script>
</head>
<body onload="show()" style="font-size: 120px;">
<div id="txt"></div>
</body>
</html>

    展开全部

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
编辑
预览

报告相同问题？

手机看
程序员都在用的中文IT技术交流社区

程序员都在用的中文IT技术交流社区

专业的中文 IT 技术社区，与千万技术人共成长

专业的中文 IT 技术社区，与千万技术人共成长

关注【CSDN】视频号，行业资讯、技术分享精彩不断，直播好礼送不停！

关注【CSDN】视频号，行业资讯、技术分享精彩不断，直播好礼送不停！

 客服 返回
顶部