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

选中决策报表中的报表块report0,点击工具栏上的冻结,弹出重复与冻结设置对话框,勾选并设置重复标题行从第1行至第2,勾选冻结第1行至第2行,
选中报表块report0,添加初始化后事件,代码如下:
 

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)  

猜你喜欢

转载自blog.csdn.net/qq_35201754/article/details/83586789