0          1

Form12.frm

11.png

setTimeout(function() {

    var $report = $("div[widgetname=REPORT21]");

    //获取对应report的div元素

    var $scroll = $report.find("#frozen-center");

    //获取对应report的div元素的滚动块元素,冻结为#frozen-center,未冻结且未安装自定义滚动条插件为.reportContent,未冻结且安装了自定义滚动条插件为.scrollDiv

    var flag = window.flag0;

    //设置全局变量flag,每个报表块需保证各不相同

    $report.find("#frozen-center").css('overflow-x', 'hidden');

    $report.find("#frozen-center").css('overflow-y', 'hidden');

    $report.find("#frozen-north").css('overflow-x', 'hidden');

    $report.find("#frozen-north").css('overflow-y', 'hidden');

    //冻结情况下隐藏滚动条

    $report.find(".reportContent").css('overflow-y', 'hidden');

    $report.find(".reportContent").css('overflow-x', 'hidden');

    //非冻结情况下隐藏滚动条

    flag = true;

    //定义全局参数flag,用来控制滚动的暂停和继续

    $scroll.mouseover(function() {

        flag = false;

    })

    //鼠标悬浮,滚动停止

    $scroll.mouseleave(function() {

        flag = true;

    })

    //鼠标离开,继续滚动

    var old = -1;

var txt=

    setInterval(function() {

        if (flag) {

            currentpos = $scroll[0].scrollTop;

            //获取距顶部距离

if (currentpos==1){

//单元格所在行字体颜色为红色

$(this).css("color", "red");

//单元格所在行字体:11px  

            $(this).find("td").css("font-size", "18px");

}

            if (currentpos == old) {

                $scroll[0].scrollTop = 0;

                //若已到达底部,则重置

            } else {

                old = currentpos;

                $scroll[0].scrollTop = currentpos + 1;

                //若未到达底部,则向下移动1.5像素

            }

        }

    }, 80);

    //以25ms的频率执行

}, 1000);


FineReport 珠珠88 发布于 2020-10-9 16:56 (编辑于 2020-10-10 22:18)
1min目标场景问卷 立即参与
回答问题
悬赏:3 F币 + 添加悬赏
提示:增加悬赏、完善问题、追问等操作,可使您的问题被置顶,并向所有关注者发送通知
共1回答
最佳回答
0
luojian0323Lv7资深互助
发布于2020-10-10 17:53(编辑于 2020-10-12 09:10)
setTimeout(function() {
    var $report = $("div[widgetname=REPORT0]");
    //获取对应report的div元素
    var $scroll = $report.find("#frozen-center");
    //获取对应report的div元素的滚动块元素,冻结为#frozen-center,未冻结且未安装自定义滚动条插件为.reportContent,未冻结且安装了自定义滚动条插件为.scrollDiv
    var flag = window.flag0;
    //设置全局变量flag,每个报表块需保证各不相同
    $report.find("#frozen-center").css('overflow-x', 'hidden');
    $report.find("#frozen-center").css('overflow-y', 'hidden');
    $report.find("#frozen-north").css('overflow-x', 'hidden');
    $report.find("#frozen-north").css('overflow-y', 'hidden');
    //冻结情况下隐藏滚动条
    $report.find(".reportContent").css('overflow-y', 'hidden');
    $report.find(".reportContent").css('overflow-x', 'hidden');
    //非冻结情况下隐藏滚动条
    flag = true;
    //定义全局参数flag,用来控制滚动的暂停和继续
    $scroll.mouseover(function() {
        flag = false;
    })

    //鼠标悬浮,滚动停止
    
    $scroll.mouseleave(function() {
        flag = true;
    })
    //鼠标离开,继续滚动
    var old = -1;
    
       
    setInterval(function() {
        if (flag) {
            currentpos = $scroll[0].scrollTop;
            //获取距顶部距离
            if (currentpos == old) {
                $scroll[0].scrollTop = 0;
                //若已到达底部,则重置
            } else {

                old = currentpos;
                $scroll[0].scrollTop = currentpos + 1;
                //若未到达底部,则向下移动1像素
                $report.find("#frozen-center tbody tr").each(function() {
                    // FR.Msg.toast($(this).index())
                    // alert($(this).index()+1)
                
                if($scroll[0].scrollTop<15){
                                  if (this.id !== 'r-0-0'&&this.id!='r-1-0'&& parseInt(($scroll[0].scrollTop+30)/30/($(this).index()+1))==($(this).index()+1)) {
                
                                        $(this).children("td").each(function() {
                                        // $(this).css("color",'red');
                                        $(this).css({"font-weight":'bold',"color":'red'})
                                        this.style.fontSize='13px'
                                    })}
                                            
                                    }
                                    else{
            

                                        if ( this.id !== 'r-0-0'&&this.id!='r-1-0'&& parseInt(($scroll[0].scrollTop)/30)==$(this).index()) {
                
                                            $(this).children("td").each(function() {
                                            // $(this).css("color",'red')
                                           $(this).css({"font-weight":'bold',"color":'red'})
                                           this.style.fontSize='13px'

                                        })}
                                    
                                        }
                                    });
                    }
        }
    }, 80);
    //以25ms的频率执行
}, 1000);

滚动报表特效.gif

测试结果,字体不宜调太大,不然就不滚动了。你可以优化一下。

滚动报表测试.frm


  • 珠珠88 珠珠88(提问者) 有注释吗?
    2020-10-10 21:12 
  • 珠珠88 珠珠88(提问者) 上传了模板,你看是有什么问题吗?还是不能实现啊
    2020-10-10 22:17 
  • luojian0323 luojian0323 回复 珠珠88(提问者) 我的示例中没有合并单元格,你的示例中有合并单元格。 这样获取到行索引会不正确。建议取消三行合并一行的合并单元格
    2020-10-12 08:12 
  • luojian0323 luojian0323 回复 珠珠88(提问者) 你的版本高了,我这边打开运行不了。
    2020-10-12 08:15 
  • 珠珠88 珠珠88(提问者) 回复 luojian0323 你的模板可以上传一下吗?
    2020-10-12 08:59 
  • 3关注人数
  • 387浏览人数
  • 最后回答于:2020-10-12 09:10
    请选择关闭问题的原因
    确定 取消
    返回顶部