For some special templates, many charts may be placed on one page in order to display more abundantly and comprehensively. forms, etc. Incomplete display of content due to excessive content that exceeds the size of the browser window. In this way, we need to use the JS scrolling effect to solve the problem. Here we mainly introduce the specific production method in FineReport.
Add loading end event
Click the menu template > template web properties > page preview settings, select "set separately for this template", and add a "loading end" post event, as shown in the following figure:
The JS code is as follows:
/ / Delay 2000MS execution event (scroll) from the end of page load
setTimeout(function(){
// when the mouse is clicked
$(".content-container").click(function()
{
//If the page is executing the event (scroll)
if(interval)
{
//Cancel event (scroll)
clearInterval(interval);
}
})
var old=-1;
//Continuously call the scroll event according to the specified cycle
var interval=setInterval(function()
{
currentpos=$(".content-container")[0].scrollTop;
if (currentpos==old){
//Cancel event (scroll)
clearInterval(interval);
// reload the page
window.location.reload();
}
else
{
old=currentpos;
//Scroll 3.5PX each time at a speed of 25MS
$(".content-container")[0].scrollTop=currentpos+3.5;
}
}
,25);
},2000)
save and preview
Save the template, click the paging preview, and the above automatic scrolling effect will appear. If you want to stop scrolling, click the window with the left mouse button.