A page or chart with minimal vertical overflow will display two translucent scroll buttons at the lower right of the display screen that scroll up and down.
When the page or chart vertical overflow exceeds two viewable pages, four scroll buttons appear.
When a chart overflows horizontally but not vertically, two buttons appear scrolling left and right.
When a chart overflows in both directions six buttons can appear.
If the overflow exceeds two viewable pages in both directions, eight buttons appear with the additional buttons that scroll to the top, left edge, right edge or bottom of the page.
IMPORTANT! The grab and drag feature was introduced in TNG v13. When the chart is dragged it moves the chart within the div using CSS translation which DOES NOT change the scroll coordinates. Since Scroll mod scrolls the div coordinates, it will still scroll the the chart within the div if it has been dragged. However, it cannot scroll the chart back to the original position. Use the 1:1 magnifier glass to return the chart to the original coordinates within the div.
CONTROL BEHAVIOR OPTIONS
The first option is the vertical scroll distance. This controls how far the up and down the page content moves. The number represents the percentage of the display height. The range limits are from 10 to 100. A setting of 10 does not scroll the screen very far while 100 scrolls the height of the display. Changing this value is useful when using a template that has a sticky header or you do not want the last line viewed to scroll off the screen.
The second option is the horizontal scroll distance. This controls how far the left and right the page content moves. The number represents the percentage of the page width on most templates. Otherwise percentage of client screen width is used. The range limits are from 10 to 100. A setting of 10 does not scroll the screen very far while 100 scrolls the width of the page or screen. Changing this value is useful when you want to scroll the chart a smaller distance horizontally.
The third option sets the scroll button vertical position from the bottom of the page.
The fourth option sets the scroll button vertical Horizontal from the bottom either the edge of page content for the right side of the display.
The fifth option determines if the horizontal scroll position determined from the right edge of the page or right edge of the display screen.
The sixth option scrolls select charts and pages listed in the $scroll_select array located in the scrollconfig.php file. Any page active page in this array displats scroll buttons if the content overflows.
The scrollconfig.php file also contains a $scroll_none array. Active pages in this array DO NOT display scroll buttons, regardless of the files listed in the $scroll_select array.
The seventh option hides the scroll buttons on the home page even if the page has overflowing content. If scrolling charts is enabled, this option has no effect.
The mod automatically hides scroll buttons on pages listed in scrollconfig.php file located in the TNG root folder. The $scroll_none array contains a few files, most of which are commented out. You can uncomment any file or add files to the array if you want to hide buttons on particular pages. The $scroll_charts array lists which pages to scroll when Scroll Charts Only is enabled.
If you use a custom template that uses the TNG scroll to top function, it will not appear on any overflowing pages.
NOTE: Scroll to Top and Scroll Mod buttons may appear together if you created your own scroll to top function and did not use the TNG scroll code. This may also occur with some TNG/Wordpress integrations.
Scroll buttons can be customized by adding a few classes to the root mytngstyle.css or template mystngstyle.css file. You can change the color, size shape and position. Examples of the classes and their functions are included in the scrollpage-info.css file located in the scrollmod folder.
Search results can display more scrolling content by going to the admin control panel, select General, Miscellaneous, Max Search Results and set it to a higher value. This results in longer, but fewer page results.
Scroll mod also scrolls pages made with the historytemplate.php file the include the TNG footer.
SCROLLING BEHAVIOR
Clicking a button once scrolls a percentage of the page specified in the mod options. However, if the button is clicked again, before scrolling stops, it will scroll a little further. This allows double clicking to scroll a slightly longer distance. You can then scroll back one click to see page content. This feature does not unless work double chevrons are shown in the scroll direction.
TNG WIKI download link
For TNG v 13 to v15.0.0
05 Feb 2025 - Scroll container can be positioned from mod options using either page content or display width
02 Jan 2025 - Scroll script loads in the footer to improve page loading
24 Jul 2024 - Changed anchor due to conflict
24 Jul 2024 - Changed anchor due to conflict
24 Jul 2024 - Refactored some php code, fixed a couple of js variables and deleted some unnecessary queries.
31 Mar 2024 - Renumbered mod as it is compatible with v13 and v14
29 Mar 2024 - Resolved duplicates and buttons not appearing on some templates
22 Mar 2024 - Changed anchor point to avoid button loading twice in some templates.
17 Mar 2024 - Removed some queries and variables that were not needed.
10 Mar 2024 - Removed white space at top of page on GWT templates and templates 19 and 21.
Added horizontal scrolling to edge of page.
Uses page or client screen width for scroll calculations.
Added option to only scroll charts
26 Feb 2024 - Rewrote mod new scroll scriptsUses page or client screen width for scroll calculations.
Added option to only scroll charts
09 Dec 2023 - Removed redundant css and php code.
18 Nov 2023 - Added horizontal scrolling.
Scroll Mod script loads once per page.
Scrolls pages created with historytemplate.php
Scrolls pages created with historytemplate.php