Re: Proposal: Fixed Table Headers in CSS

On Dec 15, 2009, at 12:40 PM, Tab Atkins Jr. wrote:

> On Tue, Dec 15, 2009 at 12:47 PM, Brad Kemper <brad.kemper@gmail.com> wrote:
>> The iPhone interface for such iPhone apps as "Contacts" solves this very neatly. The sticky content does not accumulate within the viewport, but instead gets pushed off-screen when other sticky content scrolls up to meet it. If you are not familiar with this iPhone convention, then first take a look at this jQuery-based demo I found on the Web:
>> 
>> http://demo.marcofolio.net/iphone_contact/
> 
> Dude made things *way* too complicated.  I grabbed his code, fixed it
> so that it does what we actually want (gradual displacement), and just
> generally simplified things.  If you ignore accumulation, the whole
> thing is ridiculously easy to do in JS (11 lines total, 5 significant
> lines of code).
> 
> http://www.xanthir.com/etc/stickypos/

Just saw this in Webkit. Yeah, that is the idea. If you make the background on the letter headers (H1's) translucent (and the background on the LI's white), then it would be more like the real thing, and you can see the address entries as they pass under the headers. But the motion effect of the scrolling is correct.

Received on Wednesday, 16 December 2009 15:05:48 UTC