Headroom.js - Hide your header on scroll(wicky.nillia.ms)

over 7 years ago from Bruno Daniel, Co-founder, Flying Dog

  • Nick WilliamsNick Williams, over 7 years ago

    No disrespect taken! However, I would like to respond to some of the things you've said...

    Firstly, I think a couple of hundred lines of JS is negligible, being as it only weighs 1.2kb minified & gzipped. When the average amount of JS per page is > 250kb [0], this is a drop in the sea!

    As for the effect, it is subtly different from the static (static in css terms) header you describe. I think of it as a halfway house between a fixed header and a static header. You get the benefits of static header (maximising vertical screen space) while keeping the benefits of a fixed header (primary navigation always close to hand).

    Does it work well in all circumstances? Certainly not! Does it work well in some circumstances? Definitely! As with most UX patterns, blindly applying them is foolish. Instead decide whether it fits your use-cases, and go from there.

    [0] http://httparchive.org/trends.php#bytesJS&reqJS

    1 point
    • Jonathan SvärdénJonathan Svärdén, over 7 years ago

      It has its uses, you're right about that. Lately though, I've been looking more closely at site performance and load speed, and you need to really weigh the pros and cons of anything you add to the page, no matter how light it may look.

      Still, kudos on this project. I wish my code was half as readable as yours.

      0 points