FR决策表单JS实现自动滚屏/滚动效果

选中决策报表中的报表块report0,点击工具栏上的冻结,弹出重复与冻结设置对话框,勾选并设置重复标题行从第1行至第2,勾选冻结第1行至第2行,
选中报表块report0,添加初始化后事件,如下图所示:
s代码如下:
代码复制
if(window.interval2){clearInterval(window.interval2);}  
setTimeout(function(){  
    $("div[widgetname=REPORT0]").find("#frozen-north")[0].style.overflow="hidden";  
    $("div[widgetname=REPORT0]").find("#frozen-center")[0].style.overflow="hidden";  
    },100);  
    //隐藏报表块report0的滚动条  
window.flag=true;  
setTimeout(function(){     
$("#frozen-center").mouseover(function()    
{    
  window.flag=false;    
  })  
  //鼠标悬停,滚动停止  
$("#frozen-center").mouseleave(function()    
{    
  window.flag=true;    
  })    
  //鼠标离开,继续滚动  
var old=-1;     
window.interval2=setInterval(function()    
{  
if(window.flag){  
   currentpos=$("#frozen-center")[0].scrollTop;    
   if (currentpos==old){  
    $("#frozen-center")[0].scrollTop=0;  
     }    
   else {    
      old=currentpos;    
      $("#frozen-center")[0].scrollTop=currentpos+1.5;    
        }    
      }  
    },25);  
    //以25ms的速度每次滚动3.5PX  
},1000)  
js主要实现的功能是:决策报表块在冻结标题行后实现循环滚动,鼠标悬停暂停和鼠标离开继续滚动的效果(隐藏了滚动条)。悬停事件为mouseover,离开事件为


mouseleave。
注:div[widgetname=REPORT0]")里需根据报表块名称修改,这里是report0;
注:如果想实现多报表块同时滚动,则将$("#frozen-center")替换为$(".frozen-center"),[0]表示报表块的位置,如果不是第一个需要换成对应的位置。
js代码如下:
代码复制
if(window.interval2){clearInterval(window.interval2);}  
setTimeout(function(){    
    $("div[widgetname=REPORT0]").find(".frozen-north")[0].style.overflow="hidden";    
    $("div[widgetname=REPORT0]").find(".frozen-center")[0].style.overflow="hidden";    
    },100);    
    //隐藏报表块report0的滚动条    
window.flag=true;    
setTimeout(function(){       
$(".frozen-center").mouseover(function()      
{      
  window.flag=false;      
  })    
  //鼠标悬停,滚动停止    
$(".frozen-center").mouseleave(function()      
{      
  window.flag=true;      
  })      
  //鼠标离开,继续滚动    
var old=-1;       
window.interval2=setInterval(function()      
{    
if(window.flag){    
   currentpos=$(".frozen-center")[0].scrollTop;      
   if (currentpos==old){    
    $(".frozen-center")[0].scrollTop=0;    
     }      
   else {      
      old=currentpos;      
      $(".frozen-center")[0].scrollTop=currentpos+1.5;      
        }      
      }    
    },25);    
    //以25ms的速度每次滚动3.5PX    
},1000)  
如未设置冻结标题行,则将$("#frozen-center")替换为$(".reportContent"),安装了自定义滚动条插件(1.2版本)情况下可以将$("#frozen-center")替换成


$(".scrollDiv")。
js代码如下:
代码复制
if(window.interval2){clearInterval(window.interval2);}  
setTimeout(function(){  
    //$("div[widgetname=REPORT0]").find("#frozen-north")[0].style.overflow="hidden";  
    $("div[widgetname=REPORT0]").find(".reportContent")[0].style.overflow="hidden";  
    },100);  
      
window.flag=true;  
setTimeout(function(){     
$(".reportContent").mouseover(function()    
{    
  window.flag=false;    
  })  
$(".reportContent").mouseleave(function()    
{    
  window.flag=true;    
  })    
var old=-1;     
window.interval2=setInterval(function()    
{  
if(window.flag){  
   currentpos=$(".reportContent")[0].scrollTop;    
   if (currentpos==old){  
    $(".reportContent")[0].scrollTop=0;  
     }    
   else {    
      old=currentpos;    
      $(".reportContent")[0].scrollTop=currentpos+1.5;    
        }    
      }  
    },25);    
},1000)  
  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值