美文网首页
jq一行文字左右滚动

jq一行文字左右滚动

作者: cs大个子女生 | 来源:发表于2020-05-07 09:40 被阅读0次

效果图

代码

源码

 <div class="hah">你好呀我好呀啦啦啦嘻嘻</div>

    <script>

        $(function () {

            var jie1, jie2, zong, scrollTimer;

            var num = $(".hah").text();

            zong = num;

            // 鼠标滑过滚动停止

            $(".hah").hover(function () {

                clearInterval(scrollTimer)

            }, function () {

                // 鼠标离开滚动继续

                scrolls();

            });

            function scrolls() {

                scrollTimer = setInterval(function () {

                    // 获取从0到第一个的文字

                    jie1 = zong.substring(0, 1);

                    // 获取1后面以后的所有文字

                    jie2 = zong.substring(1);

                    zong = jie2 + jie1;

                    $(".hah").text(zong)

                }, 2000);

            }

            scrolls();

        })

    </script>

相关文章

网友评论

      本文标题:jq一行文字左右滚动

      本文链接:https://www.haomeiwen.com/subject/msloghtx.html