对于一些特殊的模板，可能为了展示的更加丰富、全面会在一个页面放置很多图表。表格等内容。由于内容过多，超出了浏览器窗口的大小导致内容展示不全的情况。这样我们就需要用到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. 浅析js中取绝对值的2种方法

    1.abs()   var aaa=-20;   var bbb=Math.abs(aaa); 2.加减法   var aaa=-20;   var bbb=-aaa

  2. numpy的ravel（）和flatten（）函数比较

    功能 两个函数的功能都是将多维数组降为一维. 用法 import numpy as np arr = np.array([[1, 2],[3, 4]]) arr.flatten() arr.ravel ...

  3. 理解HashMap的原理

    HashMap内部数据结构        HashMap内部采用数组和链表结合的方式来存取数据(见下图).这种方式有什么好处呢? 我们知道,数组操作对于检索是O(1)的,能够很快的根据数组的下标定位对 ...

  4. java日期加减操作

    1.用java.util.Calender来实现 Calendar calendar=Calendar.getInstance();      calendar.setTime(new Date()) ...

  5. win7,8走网络打印机出现删除设备和打印机门未关闭的解决方法

    不多说,直接上干货! 用学校的内网连接, 即可. 右键,查看设备网页. 出现下面的情况: 多学学. 欢迎大家,加入我的微信公众号:大数据躺过的坑        人工智能躺过的坑       同时,大家 ...

  6. linux内核移植过程问题总结

    移植内核:2.6.30.4内核根目录下的.config为当前配置内核的且已经配置好的内核配置.make zImage以此为依据配置内核的过程:cd linux-2.6.30.4(进入Linux根目录) ...

  7. Web服务端性能提升实践

    随着互联网的不断发展,日常生活中越来越多的需求通过网络来实现,从衣食住行到金融教育,从口袋到身份,人们无时无刻不依赖着网络,而且越来越多的人通过网络来完成自己的需求. 作为直接面对来自客户请求的Web ...

  8. dynamic解析Http xml格式响应数据

    继续上一篇 构建RESTful风格的WCF服务 ,咱已经把服务端的数据和服务准备好了,客户端调用 wcf rest接口后如何解析xml?下面使用dynamic关键字解析来至于WCF REST XML响 ...

  9. elasticsearch（二） 之 elasticsearch安装

    目录 elasticsearch 安装与配置 安装java 安装elastcsearch 二进制安装(tar包) 在进入生产之前我们必须要考虑到以下设置 增大打开文件句柄数量 禁用虚拟内存 合适配置的 ...

  10. Java并发编程-核心问题(1)

    一.常见问题 从小的方面讲, 并发编程最常见的问题就是可见性.原子性和有序性问题. 从大的方面讲, 并发编程最常见的问题就是安全性问题.活跃性问题和性能问题. 下面主要从微观上分析问题. 二.可见性问 ...