Table Floaters

By Daniel Dawson Last update Aug 12, 2008 — Installed 844 times.
Script Summary:
Keeps table headers visible; useful for long tables where you would otherwise scroll back and forth just to see what the columns mean.
Version: 1.3.4
Copyright: Licensed under GPL v2

Remotely hosted version

Script homepage

Recently Updated TopicsPosts
Archived Comments7

this script has 1 topic, 7 posts

This script has no reviews.

Do you often find yourself looking at a long table and having to scroll up to read the column labels, then back down to where you were? This script aims to eliminate (or at least reduce) the need to do so. It creates duplicates of all table headers (either cells inside thead or th cells in the first row). Then, whenever a table is showing but the header is scrolled off, these duplicates are shown, fixed at the top of the window.

Changes in 1.3.4

  • Added logo.

Changes in 1.3.3

  • Updated list of style properties to be copied on cloning.

Changes in 1.3.2

  • Fixed bug in setup: adding anonymous function as event handler for the scroll event. Since all anonymous functions are distinct, another redundant copy would be added every time setup ran, causing performance to get gradually worse.
  • Added config to allow a delay after setup is called through the DOMSubtreeModified event, to improve performance, especially in Web 2.0 applications.

Changes in 1.3.1

  • Fixed infinite loop in FF 3 caused by modifying the tree in function handling DOMSubtreeModified event (fixed by temporarily removing event handler in setup).

Changes in 1.3

  • Now compensates for user-adjusted font sizes.
  • Now rounds up header cell widths; fixes visual glitch with cell text wrapping inappropriately.

Changes in 1.2.1

  • Fixed this-qualification bug in clone-first-row-without-TH code.

Changes in 1.2

  • Added a nice little XUL configure dialog in place of the awkward use of GM userscript commands. Now just go to (Options/Tools) > Greasemonkey > User Script Commands > Configure Table Floaters...
  • Fixed an issue with floaters appearing on printouts by classing all floaters as tableFloaterCell and inserting an !important rule applying to print media.

Changes in 1.1

  • Merged fixed-positioning and absolute-positioning versions; you now choose the mode through a user script command (look under Tools > Greasemonkey).
  • Added the possibility to clone the first row of each table that defines neither a thead nor any th cells in the first row, as a last fallback. As this will catch tables that really aren't supposed to have a header (e.g. the vast number of pages using tables for grid layouts!), the option is disabled by default. Use the appropriate command if you want to try it.

Changes in 1.0

  • Fixed bug causing floater to disappear when cell has z-index 'auto' but ancestor has non-auto z-index.

Changes in 0.3

  • Eliminated error when none of a table's cells is cloned.
  • Now inserts clones at beginning of body, instead of at end; unfortunately, they still appear on top in FF 2 (seems to violate CSS 2.1).
  • Now handles headers for multiple tables concurrently. A header for a nested table is handled, so long as none of the ancestor tables has its own header.

Changes in 0.2

  • Now correctly handles theads with multiple rows.
  • Display now properly constrained so cloned cells never show below any of the real table cells (aside from delayed scroll events).
  • Tables with no body rows are no longer even considered.

Known issues

  • Text inside cloned cells is always top-aligned, regardless of style settings (vertical-align only applies inside line boxes and table cells). I know of no easy solution to this.
  • Floaters should be stacked only just above the rest of the flow; currently, if there are any fixed-position elements, the floaters will appear above them, instead of below as they should. I know of no solution to this.
  • Watch out for theads that are as high or nearly as high as the window; you won't be able to see anything else.
  • You have to wait until the page finishes loading to see the floaters, since page layout isn't finalized until then.
  • There are no events for style changes in DOM 2; thus, if a property is changed that affects one or more header cells, this script cannot react.
  • If any floaters are active, and you go to Print Preview, when you return, new floaters will be created, but the old copies will still be there where you left them, and they will be stuck in place and refuse to go away. Apparently, a 'resize' event has been triggered, but why hasn't the cleanup method been called?
  • Some floaters are positioned and/or sized incorrectly. One of these days I'll find out why and fix it. I suspect it involves table nesting.

TODO

  • Maybe handle headers on the left-hand side?
  • Maybe handle tfoot?