對於一些特殊的模板,可能爲了展現的更加豐富、全面會在一個頁面放置不少圖表。表格等內容。因爲內容過多,超出了瀏覽器窗口的大小致使內容展現不全的狀況。這樣咱們就須要用到JS滾屏效果來解決,這裏主要介紹在FineReport中的具體制做方法。 web
添加加載結束事件
點擊菜單模板>模板web屬性>分頁預覽設置,選擇「爲該模板單獨設置」,添加一個「加載結束」後事件,以下圖所示:瀏覽器
JS代碼以下:spa
//從頁面加載結束後延遲2000MS執行事件(滾動) setTimeout(function(){ //當鼠標點擊時 $(".content-container").click(function() { //若是頁面正在執行事件(滾動) if(interval) { //取消事件(滾動) clearInterval(interval); } }) var old=-1; //按照指定週期不斷的調用滾動事件 var interval=setInterval(function() { currentpos=$(".content-container")[0].scrollTop; if (currentpos==old){ //取消事件(滾動) clearInterval(interval); //從新加載頁面 window.location.reload(); } else { old=currentpos; //以25MS的速度每次滾動3.5PX $(".content-container")[0].scrollTop=currentpos+3.5; } } ,25); },2000)
保存與預覽
保存模板,點擊分頁預覽,就會出現上面的自動滾動效果。若是想要中止滾動的話,用鼠標左鍵點擊一下窗口便可。code