对于一些特殊的模板，可能为了展示的更加丰富、全面会在一个页面放置很多图表。表格等内容。由于内容过多，超出了浏览器窗口的大小导致内容展示不全的情况。这样我们就需要用到JS滚屏效果来解决，这里主要介绍在FineReport中的具体制作方法。

添加加载结束事件

点击菜单模板>模板web属性>分页预览设置，选择“为该模板单独设置”，添加一个“加载结束”后事件，如下图所示：

JS代码如下：

保存模板，点击分页预览，就会出现上面的自动滚动效果。如果想要停止滚动的话，用鼠标左键点击一下窗口即可。

FineReport中如何实现自动滚屏效果的更多相关文章

  1. 帆软报表（finereport）实现自动滚屏效果

    例如Demo:IOS平台年度数据报表. 展示内容丰富,一个页面中存在多个图表.内容,超出了浏览器窗口的大小导致内容展示不全. 为了能够预览这个报表的全部内容,可以使用JS滚屏效果来实现. 操作步骤: ...

  2. jquery实现自动滚屏效果，适用用公告新闻等滚屏

    从网络上找到的例子,自己做了下扩展,原示例是向上滚动,扩展了一个向下滚动的方法: <html xmlns="http://www.w3.org/1999/xhtml"> ...

  3. 基于 ECharts 封装甘特图并实现自动滚屏

    项目中需要用到甘特图组件,之前的图表一直基于 EChart 开发,但 EChart 本身没有甘特图组件,需要自行封装 经过一番鏖战,终于完成了... 我在工程中参考 v-chart 封装了一套图表组件 ...

  4. jQuery实现 自动滚屏操作

    实现自动滚屏思路: 1.滚屏即:文本的往上移动一段距离: 2.那么我们使文本每过一段时间就往上移动一段固定距离,就可实现滚屏: 3.直到文本底部出现在浏览器窗口中,专业点就是 文本移动的距离 + 浏览 ...

  5. javascript实现页面滚屏效果

    当我们浏览网页的时候,时常会碰到可以滚动屏幕的炫酷网页,今天笔者对这一技术进行简单实现,效果不及读者理想中那般炫酷,主要针对滚屏的技术原理和思想进行分享和分析.本示例在页面右侧有五个数字标签,代表五个 ...

  6. js中网页图片自动更换的效果

    <script> var arr=new Array(); arr[]="url(images/city.jpg)"; arr[]="url(images/d ...

  7. js实现双击滚屏效果

    <body onDblClick="s=setInterval('scrollBy(0,2)',50)" onMousedown="clearInterval(s) ...

  8. 利用jquery.fullPage.js 和 scrolloverflow.min.js 实现滚屏效果

    参考链接:https://blog.csdn.net/c11073138/article/details/79631036 /* 按着思路去search. */

  9. js手机滚屏效果

    原文地址:https://github.com/yanhaijing/zepto.fullpage 第一步:基于移动端的浏览体验,在头部添加浏览器渲染的分辨率 <meta name=" ...

随机推荐

  1. 全屏背景图的实现及background的相关属性

    今天需要做一个占满设备宽度的轮播图,这里作为demo仅展示一张图,下面分别是要操作的图片(这里做了缩放处理,实际的图比较大),以及要实现的效果图,很明显两者是不成比例的:      (图一)     ...

  2. POJ 2389

    #include <iostream> #include <algorithm> #include <string> #define MAXN 300 using ...

  3. POJ 1247

    #include<iostream> using namespace std; int main(){ ,sum=; int * guest; do{ sum=; sam_num=; ci ...

  4. 【DB2】关闭表的日志功能

    2018.11.19 客户遇到一个问题,在import数据的时候,产生了大量的日志,客户的数据库是HADR模式,通过评估,这几张表是可以允许在备库上不查询的,表中的数据时临时的. 方案一:修改脚本,将 ...

  5. Centos7 nginx安装过程

    一.Centos版本: cat /etc/centos-release CentOS Linux release 7.1.1503 (Core) 二.nginx下载 官网:http://nginx.o ...

  6. Python -- 网络编程 -- Socket发送文件

    客户端如果直接send两次,一次发文件名,一次发文件内容 服务端接受的时候会一起接收,不知怎么分开发送,或者分开接收, 或者全部接收再解析内容 今天发现传送mp3文件的时候没问题,传送文本文件的话,以 ...

  7. C/C++练习题（一）

    1. volatile 关键字在 C++ 中的性能和 C 的一样? 作用是一样的,但是其内部实现原理可能不同. 2. scanf 格式化输入是怎么赋值的? 由于scanf输入的数据个数是不定的,从键盘 ...

  8. docker 使用swarm overlay网络时，报“network xx not manually attachable”错误解决

    当使用swarm的overlay网络,在该网络中运行容器时报“network xx not manually attachable”的错误 docker network create -d overl ...

  9. 梯度下降法的三种形式-BGD、SGD、MBGD

    在应用机器学习算法时,我们通常采用梯度下降法来对采用的算法进行训练.其实,常用的梯度下降法还具体包含有三种不同的形式,它们也各自有着不同的优缺点. 下面我们以线性回归算法来对三种梯度下降法进行比较. ...

  10. 自学C Primer Plus时还没想明白的问题

    2016年11月24日 1. 计算机中两个浮点数怎样进行加法运算.2. 为什么计算机在计算时存在损失精度的可能3. 无符号数和有符号数的运算是怎样的4. printf中使用格式控制符的截断问题,比如% ...