滚动的文字效果就类似广告的LED

最新推荐文章于 2019-03-13 15:39:52 发布

原创最新推荐文章于 2019-03-13 15:39:52 发布 · 1.5k 阅读

1 ·

CC 4.0 BY-SA版权

前端JS 同时被 2 个专栏收录

39 篇文章

订阅专栏

javascript简单文字滚动效果

1 篇文章

订阅专栏

本文介绍了一个简单的HTML页面，该页面使用JavaScript实现了一段文字的动态滚动展示效果。通过定时器函数每秒更新显示的文字顺序，实现了文字的循环滚动。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        var s = ("恭喜本次中奖的观众 小丁 中了大奖  草你的吗BB  I'LL FUCK YOU ").split("");
        setInterval(function () {
            s.push(s.shift());
            document.getElementById("text").innerHTML = s.join(" ");
        },1000);
    </script>
    <style>
        #text{
            background-color: darksalmon;
            width: 50%;
            position: relative;
            left: 350px;
        }
    </style>
</head>
<body>
    <div id="text">

    </div>

</body>
</html>
效果  ：