My favorites | Sign in
Project Home Downloads Wiki Issues Source
Search
for
FloatingHeader  
jQuery floating header plugin documentation page.
jquery, floatheader
Updated Jan 3, 2011 by erik.bys...@gmail.com

Introduction

A plugin that makes sure the THEAD of a table always is visible. This is done by creating a floating copy of the THEAD element on top of the table when the original header is outside the viewport.

The plugin is tested on: FF, Chrome, Opera, IE 6, IE 7/8

NOTE:As expected there are still some strangeness on IE6, if you're good at IE6-compatibility please A) drop me a line B) send me a patch.

News

2011-01-04 (1.4.0)

  • Lazy loading of tables and performance optimations by Jason Axley

2010-08-02 (1.3.0)

2010-07-08 (1.2.0)

2009-10-19 (1.1.0)

  • Corrected some errors pointed out by William Shostak
  • Fixed IE6 compatibility (still some strangeness on some webpages)
  • Tested with IE 6, 7 and 8, FF 3.0, 3.5 and Opera 10.0

2009-10-16 (1.0.8)

  • Added fixes made by Vasilianskiy Sergey and William Shostak
  • Reverted to clone the whole table
  • Minor restructures
  • Tested with FF, Chrome, IE7, IE8

2009-10-15 (1.0.7)

  • Added fixes made by Vasilianskiy Sergey
  • Removed class marking of table rows
  • Plugin doesn't clone the whole table, just thead

Usage

jQuery("#table").floatHeader(options);

Configuration

An optional configuration dictionary can be passed to the plugin. Accepted options are:

Option Description Default
fadeOut The length of the fade out animation in ms. 250
faceIn The length of the face in animation in ms. 250
floatClass The class of the div that contains the floating header. The style should contain an appropriate z-index value. floatHeader
cbFadeOut A callback that is called when the floating header should be faded out. The method is called with the wrapped header as argument. false
cbFadeIn A callback that is called when the floating header should be faded in. The method is called with the wrapped header as argument. false

Acknowledgements

I want to acknowledge a few people who have contributed to the development.

  • Diego Arbelaez - Contributed code to support resize events.
  • Stephen J. Fuhry - A test case for huge tables and testing of the horizontal-scroll-bug.
  • Glenn Gilbert - Compatibility for IE6/7
  • Vasilianskiy Sergey - Compatibility issues and optimization
  • William Shostak - IE compatibility

Download and Demo

All releases can be found at the jQuery project page.

A demo of the plugin can be found here.

Comment by gogo52...@gmail.com, Mar 2, 2011

Good news: this website (======= http://www.ftoto.com/ =======) we has been updated and add products welcome to visit our website. a leading worldwide wholesale company (or ucan say organization). We supply more than 100 thousand high-quality merchandise and famous brand name products all at wholesale prices.Accept paypal or credit card and free shipping. You can try oh, will make you satisfied.

-------------- http://www.ftoto.com/ -----------


Sign in to add a comment
Powered by Google Project Hosting