美文网首页
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