From TNG_Wiki
Jump to navigation Jump to search
Restricted Downloads of Scroll-xy are restricted to logged in users. If you do not have a user account on the TNG Wiki use the Request Account link to request a user account Restricted
Caution If you are having trouble downloading with the Google Chrome browser, try using try right-click and select Open in new Window, then F5, or use another browser Caution

Summary Scrolls TNG pages and charts.
Validation Latest mod is XHTML compliant.Valid-xhtml10.png
Mod Updated 13 September 2021
Download link for
TNG 12.3.0
TNG 13.0.4

Download stats Downloads Stats
Author(s) Steven Davis
Homepage Scroll-xy (This page)
Mod Support TNG Community Forums
Contact Developer Steven Davis
Latest Mod for TNG V12.1.0 and above
Min TNG V 12.1.0
Files modified
Related Mods
Written by Erik Hoppe


This mod was developed to scroll pages and charts with overflowing content.
(Thanks to Darrin and Ken for functionality suggestions)


Steven Davis


This mod places four scroll buttons in v13 and up to six scroll buttons in v12 at the lower right side of the display.
Scroll to the top, up, left, right, down and bottom of the page.
Buttons do not appear unless content overflows.
Scrolls Ahnentafel and Register pages.
Adjust the scroll height when scrolling up and down or compensate for a sticky header.
Loads with the inner menu so buttons do not appear on mobile devices.
If a template uses the scroll to top button, it will be hidden when scroll xy buttons are shown.
Includes a scroll-config.php file to control which pages display scroll buttons.
Includes an example scrollpage-info.css file to customize the buttons using mytngstyle.css.
The mod can be used with v12.1.0 through v13. With horizontal scroll exceptions for v13.0 charts.
For those that use Scrollbox_mod, scroll buttons are not shown on any pages where that mod is used.

TNG v12 and v13

Scrolls all pages and charts in TNG v12.0 though v12.3 versions.
Scrolls all pages but does not scroll charts horizontally in TNG v13 due to the new drag feature.
Scrolls all TNG v13 pages and chart pages with overflow vertically.
Since the new charts use a body div with nested outer and inner divs, Scrollx-y cannot scroll nested divs.
Horizontal scroll buttons will not appear on charts that cannot be scrolled.


When the mod is first installed, refresh the page to reload the style sheets.
Scroll buttons appear at the lower right but can be moved using css.
Scrolls pages with overflow including person, register, text and chart pages.
Examples to change the buttons are in the scrollpage-info.css file.

Vertical Overflow


Scroll buttons


All Scroll Buttons


  • A working TNG installation.
  • A backup of your TNG genlib.php and genstyle.css files.
  • An installed current version of the Mod Manager
  • Refresh the page to reload the CSS files after installation.

Revision History

Version Date Contents
v12.1.2.6a 13 September 2021 Moved inline css to genstyle.css to eliminate W3C HTML validation error
v12.1.2.6 18 July 2021 Addded script to scroll v13.3 chart page vertically
v12.1.2.5 5 December 2020 Updated CSS styling
v12.1.2.4 23 October 2020 When using a template that has a scroll to top button and the scroll select pages option is
enabled, pages that do not display scroll-xy buttons will display the scroll to top button instead.
Edit scrollconfig.php and add or comment out pages that display scroll-xy buttons.

If scroll select pages is disabled, scroll-xy buttons will be used.

v12.1.2.3a 19 October 2020 Hides Scroll the Top Button to avoid multiple buttons.
Same functional code as v12.1.2.3.
v12.1.2.3 12 September 2020 Smaller code, same functionality.
Fixed vertical scroll distance override.
v12.1.2.2c 25 May 2020 Combined a few CSS classes to make customizing the buttons easier.
Added more detail to the readme.txt file.
Default buttons are smaller using less display space
The scroll container does not load on files specified in the scrollconfig file.
v12.1.2.2b 20 May 2020 Fixed scrolling vertical chart when there is no vertical overflow and delay scroll is enabled.
Added option to adjust the horizontal scroll distance.
v12.1.2.2a 16 May 2020 Updated the ReadMe.txt file.
Added horizontal scrolling for vertical charts.
Corrected some typos in the optional scrollconfig.php.
v12.0.1.1 13 April 2019 original version of ScrollPage Mod was never added to TNG WIKI

Automated Installation

  1. Download the appropriate zip file from the Mod Summary in the upper right hand corner
  2. After downloading the zip file, unzip the config file into the mods folder
  3. Follow the normal automated installation for Mod Manager, as shown in the example Mod Manager - Installing Config Files to install the scroll-xy_v12.1.2.2a.cfg
  4. Refresh the browser to reload genstyle.css

Modmanager Edit options

  • Scroll delay hides buttons until page scrolls down
  • Number of pixels to scroll down if scroll delay is enabled
  • Adjust the horizontal scroll distance in percent of the display width
  • Adjust the vertical scroll distance in percent of the display height
  • Hides buttons on the homepage if the inner menu is displayed
  • Display buttons on specific pages specified in the scrollconfig.php file

In the event of a problem

  1. Try using the Mod Manager Remove capability
  2. Or copy your genlib.php file to your TNG directory and genstyle.css to your TNG css directory
    • all should be well now

Related Links

This mod can be used in conjunction with Scrollbox_mod

Sites using this mod

If you download and install this mod, please add your TNG site to the table below

URL User Note Mod-Version TNG-Version User-language
Family Histories Steven Davis Mod developer 12.1.6 12.3.0 EN
Berkshire Family History Society Paul Barrett Early tester, before it made it on to the Wiki 12.3.0 EN
... ... ... ... ... ...