夜雪城 2019-07-04 12:00 采纳率: 0%
浏览 303

定时器实现文字无缝滚动后定时器失效?

通过js设置了文字的无缝滚动,如图1

图1 滚动正常

但是浏览了其他页面回来后就就成了图2的样子,这个情况在谷歌、火狐、Opera都有这个情况,ie却是正常的

图2 滚动异常

js代码如下

function baner() {
    var ban = document.querySelector(".ban"),
        ba,
        index = 0,
        ru;
    if (ban) {
        ru = setInterval(run, 3000);

        function run() {
            ba = setInterval(function() {
                index++;
                ban.style.top = -index + "px";
                if (index % 20 == 0) {
                    clearInterval(ba);
                }
                if (index == 220) {
                    index = 0
                    ban.style.top = "0px";
                }
            }, 40)
        }
        /* 鼠标移入滚动停止 */
        ban.onmouseover = function() {
            clearInterval(ru);
            clearInterval(ba);
            /* 鼠标移出滚动继续 */
            ban.onmouseout = function() {
                run();
                ru = setInterval(run, 3000);
            }
        }
    }

}

html代码如下

 <div class="ban">
                <a href="" rel="nofollow">
                        <p>① 完善文章信息</p>
                </a>
                <a href="" rel="nofollow">
                        <p>② 开具初审录用</p>
                </a>
                <a href="" rel="nofollow">
                        <p>③ 编辑整理稿件</p>
                </a>
                <a href="" rel="nofollow">
                        <p>④ 英语编辑审稿</p>
                </a>
                <a href="" rel="nofollow">
                        <p>⑤ 总编室审稿</p>
                </a>
                <a href="" rel="nofollow">
                        <p>⑥ 外审编辑审稿</p>
                </a>
                <a href="" rel="nofollow">
                        <p>⑦ 排版校对</p>
                </a>
                <a href="" rel="nofollow">
                        <p>⑧ 印刷前校对</p>
                </a>
                <a href="" rel="nofollow">
                        <p>⑨ 印刷出刊</p>
                </a>
                <a href="" rel="nofollow">
                        <p>⑩ 邮寄</p>
                </a>
                <a href="" rel="nofollow">
                        <p>⑪ 出刊后30天左右知网收录</p>
                </a>
                <a href="" rel="nofollow">
                        <p>① 完善文章信息</p>
                </a>
                <a href="" rel="nofollow">
                        <p>② 开具初审录用</p>
                </a>
                <a href="" rel="nofollow">
                        <p>③ 编辑整理稿件</p>
                </a>
</div>
  • 写回答

1条回答 默认 最新

  • 桑桑13 2019-07-04 15:19
    关注

    你是不是离开页面的时候没有清除定时器

    评论

报告相同问题?

悬赏问题

  • ¥15 HFSS 中的 H 场图与 MATLAB 中绘制的 B1 场 部分对应不上
  • ¥15 如何在scanpy上做差异基因和通路富集?
  • ¥20 关于#硬件工程#的问题,请各位专家解答!
  • ¥15 关于#matlab#的问题:期望的系统闭环传递函数为G(s)=wn^2/s^2+2¢wn+wn^2阻尼系数¢=0.707,使系统具有较小的超调量
  • ¥15 FLUENT如何实现在堆积颗粒的上表面加载高斯热源
  • ¥30 截图中的mathematics程序转换成matlab
  • ¥15 动力学代码报错,维度不匹配
  • ¥15 Power query添加列问题
  • ¥50 Kubernetes&Fission&Eleasticsearch
  • ¥15 報錯:Person is not mapped,如何解決?