当前位置: 代码迷 >> 综合 >> 帆软图表内容自动滚动,鼠标悬停(跑马灯)
  详细解决方案

帆软图表内容自动滚动,鼠标悬停(跑马灯)

热度:12   发布时间:2023-11-22 10:06:09.0

样例代码如下

setTimeout(function() {//隐藏报表块 A 的滚动条$("div[widgetname=A]").find(".frozen-north")[0].style.overflow = "hidden";$("div[widgetname=A]").find(".frozen-center")[0].style.overflow = "hidden";
}, 1000);window.flag0 = true;
//鼠标悬停,滚动停止  
setTimeout(function() {$(".frozen-center").mouseover(function() {window.flag0 = false;});//鼠标离开,继续滚动  $(".frozen-center").mouseleave(function() {window.flag0 = true;});var old = -1;var interval = setInterval(function() {if(window.flag0) {currentpos = $("div[widgetname=A]").find(".frozen-center")[0].scrollTop;if(currentpos == old) {$("div[widgetname=A]").find(".frozen-center")[0].scrollTop = 0;} else {old = currentpos;//以25ms的速度每次滚动1.5PX  $("div[widgetname=A]").find(".frozen-center")[0].scrollTop = currentpos + 1.5;}}}, 25);
}, 1000);

其中需要修改的有:

修改点 注释
$("div[widgetname=REPORT0_C]")

用户需要根据报表块的名称修改 REPORT0_C,报表块的名称需要大写

find(".frozen-center")

根据实际情况修改滚动块元素:

.frozen-center:报表块中存在冻结

.reportContent:报表块中无冻结且未安装自定义滚动条插件

.scrollDiv:报表块中无冻结且安装了自定义滚动条插件

var flag = window.flag0

模板中存在多个跑马灯报表块时,依次设置为 flag0,flag1,flag2 等

需保证全局变量各不相同,否则无法实现单个暂停。

https://help.finereport.com/doc-view-2393.html