Hiding the Scrollbar Through JS

Version

Application Scenario

When the content in general reports, report blocks of dashboards, or table components of FVS templates is excessive, horizontal and vertical scrollbars will appear, significantly affecting the visual effects of reports during preview or in large-screen applications.

How can you hide the scrollbar for a better display effect?

Function Description

Two methods for hiding the scrollbar are available in FineReport V11.0.

• Method one: Use official APIs.

• Method two: Install the Custom Scrollbar plugin.

Note:

Neither of the above two methods is supported on mobile terminals.

API Description

You can use the API in the click event of a Button widget, Event After Page Load under Template, or the After Initialization event of a component as needed.

The following figure shows the effect.

Plugin Installation

After the plugin is installed, the scrollbar style is modified to a long rounded rectangle in gray. The modified scrollbar follows mouse wheel scrolling and automatically hides when idle, contributing to a cleaner interface.

For details, see Custom Scrollbar Plugin. The following figure shows the effect.

Note:

The plugin is not supported in FVS templates and older versions of dashboards.