首尾相接跑马灯悬停效果疑惑

在决策报表里,用JS实现首尾相接的跑马灯效果,如何在此基础上实现悬停呢,我的代码如下:

setTimeout(function(){  speed = 50; //滚动速度

var tab = document.getElementById("demo");//外层可视模块

var tab1 = document.getElementById("demo1");//内层滚动内容模块1

var tab2 = document.getElementById("demo2");//内层滚动内容模块2 无缝对接到1

后面的内容 tab2.innerHTML = tab1.innerHTML;//克隆demo1为demo2

tab.scrollTop = tab1.offsetHeight; //创建一个滚动函数,当滚动至demo1与demo2交界时,demo跳到最顶端

function Marquee(){    

 if (tab.scrollTop >= tab1.offsetHeight)

 { tab.scrollTop-=tab2.offsetHeight;}

else

{ tab.scrollTop+=1; } }

var MyMar=setInterval(Marquee,speed); },1500); //隐藏头尾空白行

setTimeout(function()

{  document.getElementById("r-1-0").style.height=0; },100);

 

查了一下有关贴子,在上面代码里加了如下代码但不起作用:

window.flag = true;

//鼠标悬停,滚动停止  

setTimeout(function() {

    $(".frozen-center").mouseover(function() {

        window.flag = false;

    });

 

    //鼠标离开,继续滚动  

    $(".frozen-center").mouseleave(function() {

        window.flag = true;

    });

 

chyou 发布于 2022-4-20 22:56 (编辑于 2022-4-20 23:03)
1min目标场景问卷 立即参与
回答问题
悬赏:4 F币 + 添加悬赏
提示:增加悬赏、完善问题、追问等操作,可使您的问题被置顶,并向所有关注者发送通知
共1回答
最佳回答
1
shirokoLv6资深互助
发布于2022-4-21 08:38

上面的里面增加flag的判断

-----

setTimeout(function(){  speed = 50; //滚动速度

var tab = document.getElementById("demo");//外层可视模块

var tab1 = document.getElementById("demo1");//内层滚动内容模块1

var tab2 = document.getElementById("demo2");//内层滚动内容模块2 无缝对接到1

后面的内容 tab2.innerHTML = tab1.innerHTML;//克隆demo1为demo2

tab.scrollTop = tab1.offsetHeight; //创建一个滚动函数,当滚动至demo1与demo2交界时,demo跳到最顶端

function Marquee(){ 

if (window.flag==false) null;

else if (tab.scrollTop >= tab1.offsetHeight)

 { tab.scrollTop-=tab2.offsetHeight;}

else

{ tab.scrollTop+=1; } }

var MyMar=setInterval(Marquee,speed); },1500); //隐藏头尾空白行

setTimeout(function()

{  document.getElementById("r-1-0").style.height=0; },100);

  • 2关注人数
  • 422浏览人数
  • 最后回答于:2022-4-21 08:38
    请选择关闭问题的原因
    确定 取消
    返回顶部