The ScrollPage Mod uses jQuery to scroll the display. If javascipt is disabled, the mod does not display scroll buttons.

After Scroll-xy is installed the buttons may not appear or be in the wrong position. Refresh the page to reload the style sheets (css files).

There are six scroll buttons. The buttons appear on pages that display the TNG inner menu. This prevents displaying buttons on mobile devices as they are easier to swipe with a finger. On most pages there are four primary buttons that scroll vertically. On pages with horizontal overflow, six buttons are displayed. The two additional buttons scroll horizontally. The program will only display buttons on pages that have overflowing content.

Option 1 - Scroll Delay
Enable this option (1) to hide the scroll buttons until the user scrolls down the number of pixels specified in option 2.

Option 2 - Scroll Delay Distance
When Option 1 is disabled this option does nothing. If option 1 is enabled, enter the number of pixels to scroll down before the scroll buttons appear. Valid values are 0 to 800. Keep in mind, using a high number prevents buttons from displaying if the page overflow does not exceed the number of pixels specified.

Option 3 - Scroll Horizontal Distance
Enter the horizontal scroll distance as percent. The number you enter is calculated from the clients display. This allows a consistent experience for users using different resolutions. Keep in mind if you enter 100 the page will scroll the screen width so the content at either the left or right of the page will scroll out of of view. The valid range is 10 to 100.

Option 4 - Scroll Vertical Distance
Enter the vertical scroll distance as percent. The number you enter is calculated from the clients display. This allows a consistent experience for users using different resolutions. Keep in mind if you enter 100 the page will scroll the screen height so content at either the bottom or top of the page will scroll out of of view. The valid range is 10 to 100.

Option 5 - Hide Scroll Buttons on Home Page
Enable this option (1) to hide the scroll buttons on the home page when the inner menu is displayed. (Template 15 for example)

Option 6 - Scroll Select Pages
Enable to only scroll select pages. If you want to hide the buttons on all pages except for chart pages, enable this option (1). You can edit which pages are scrollable by editing the scrollconfig.php file in the extensions folder. The $scroll-all array contains page files that display Scroll-xy buttons if the option "Scroll Select Pages" is enabled. When this option is enabled only files listed in the array displays scroll buttons. This makes it easier if to display buttons on just a few pages.

The $scroll-none array contains file names for pages that WILL NOT display scroll buttons. This is used to prevent displaying scroll buttons on pages with a small amount of overflow when "Scroll Delay" is not used. Note that the $scroll-all array has priority and will override files in this array.


If you use a custom template or want to customize colors, change the button size or move the buttons, refer to the scrollpage-info.css in this folder for the classes and rules to add to the mytngstyle.css file.

Some templates use different page formatting so @media was added to scrollpage-info.css with examples to adjust the position for different display sizes.



Scroll-xy loads when the inner menu loads. If you have pages that do not load the inner menu, scroll buttons will not appear. This prevents buttons from displaying on mobile devices, which are more easily scrolled with a finger.

If you have Erik Hoppe's ScrollBox mod installed, the scroll buttons will not appear on pages displaying charts.