Notes

  • In v2.21.1, columns now line up, especially while scrolling horizontally. It may not be pixel perfect, but it looks pretty good if table css "box-sizing" is set to "border-box".
  • In v2.21.0
    • This widget was updated to include the tfoot rows.
    • To maintain the column widths across all copied tables:
      • The widthFixed options is now forcibly set to true; I apologize if this causes any inconvience.
      • This option adds a <colgroup> containing percentage width <col> elements to each section of the scroller.
      • If this option does cause issues, use css to set each column width as a percentage.
  • In v2.17+
    • The scroller widget will now work properly with predefined column widths.
    • Shrinking the browser window will now hide the header overflow.
    • Horizontal scrolling of the table body will now properly horizontally scroll the header.
    • Changed the default scroll bar width from 17 to 18.
    • Added scroller_upAfterSort option.
  • This widget can not be applied to the original plugin and requires jQuery version 1.4+ to function properly; if you need to make it work with older versions of jQuery and the plugin, please use this version of the widget.
  • This widget was originally written by Connell & Associates, Inc. and is dual-licensed under the MIT and GPL licenses. It has been modified to work with tablesorter version 2.9+.

Options

Filter widget defaults (added inside of tablesorter widgetOptions)

TIP! Click on the link in the function column to reveal full details (or toggle|show|hide all) or double click to update the browser location.
OptionDefaultDescription
scroller_height 300 Set the height of the scroll window in pixels.
null Set the width of the scroll bar in pixels (v2.19.0)

As of v2.19.0, this option's default was changed to null because internal code was added to detect the scroll bar width which changes dramatically depending on the browser window zoom level.

If you are using a custom scroll bar plugin, this option will still accept a scroll bar width value which overrides the scroll bar width auto-detection.
"s_" This option contains a prefix string which is added to a random number (Removed).

This option was been completely removed in v2.18.0 as the id is now obtained from the unique namespace.
true

When true, the scroller automatically scrolls the inner window back to the top after sorting.

Set this option to false to prevent this behaviour, or to stop the window from scrolling after interacting with a table cell (e.g. clicking on a checkbox); new in v2.17.3
true

When true, this option makes the table header jump into view when the table body is not scolled to the top and while scrolling up the page. It's not perfect, but it works. Disable it as desired.

* To see the difference, toggle the button in the demo below, then scroll down & up the page using a mouse wheel with the cursor at the horizontal center of the page and about 100 pixels from the top, so the cursor is within the table body.

Javascript


	


	
Demo

	Choose Theme:
	

	

	 scroller_jumpToHeader : true (see the note above)*
	

	 scroller_upAfterSort  : true
	


	

	
		

			Name
			MajorSex
			English
			Japanese
			Calculus
			Geometry
		

	
	
		
NameMajorSexEnglishJapaneseCalculusGeometry

	
	
		
Student01Languagesmale80707580

		
Student02Mathematicsmale908810090

		
Student03Languagesfemale85958085

		
Student04Languagesmale6055100100

		
Student05Languagesfemale68809580

		
Student06Mathematicsmale1009910090

		
Student07Mathematicsmale85689090

		
Student08Languagesmale100909085

		
Student09Mathematicsmale80506575

		
Student10Languagesmale8510010090

		
Student11Languagesmale8685100100

		
Student12Mathematicsfemale100757085

		
Student13Languagesfemale1008010090

		
Student14Languagesfemale50455590

		
Student15Languagesmale953510090

		
Student16Languagesfemale100503070

		
Student17Languagesfemale801005565

		
Student18Mathematicsmale30495575

		
Student19Languagesmale68908870

		
Student20Mathematicsmale40454080

		
Student21Languagesmale5045100100

		
Student22Mathematicsmale1009910090

		
Student23Languagesfemale85808080

		
student23Mathematicsmale8277079

		
student24Languagesfemale100911382

		
student25Mathematicsmale22968253

		
student26Languagesfemale37295659

		
student27Mathematicsmale86826923

		
student28Languagesfemale4425431

		
student29Mathematicsmale77472238

		
student30Languagesfemale19352310

		
student31Mathematicsmale90271750

		
student32Languagesfemale60753338

		
student33Mathematicsmale4313715

		
student34Languagesfemale77978144

		
student35Mathematicsmale5815195

		
student36Languagesfemale70617094

		
student37Mathematicsmale6036184

		
student38Languagesfemale6339011

		
student39Mathematicsmale50463238

		
student40Languagesfemale5175253

		
student41Mathematicsmale43342878

		
student42Languagesfemale11896095

		
student43Mathematicsmale48921888

		
student44Languagesfemale8225973

		
student45Mathematicsmale91733739

		
student46Languagesfemale481210

		
student47Mathematicsmale8910611

		
student48Languagesfemale90322118

		
student49Mathematicsmale42494972

		
student50Languagesfemale56376754

	
	


	

	

		
			
Account #First NameLast NameAgeTotalDiscountDiff

		
		
			
A43PeterParker289.9920.3%+3

			
A255JohnHood3319.9925.1%-7

			
A33ClarkKent1815.4944.2%-13

			
A11BruceAlmighty45153.1944%+19

			
A102BruceEvans56153.1923%+9

			
A23MikePeters225.6920.3%+2

			
A55LeslieKent3315.9925.1%-3

			
A3FrankMint4412.5944.2%-12

			
A21JoeThomas4515.2544%+12

			
A12TessEvans6613.5923%+4

			
A21PeterDunn122.9921.1%+2

			
A33HarryJones1319.4922.2%-6

			
A13JohnJames1613.8942.1%-13

			
A71NickParker4513.8944%+29

			
A21CharlesDunn1915.4922%+3