Fake location of a "hash" in the URI

[Dani]

We use hashes a lot in our URIs to jump people around to a specific place on the page. For example (www.example.com#part1 and www.example.com#part2). However, we have a static fixed header at the top of the page, and so if it tries to jump you down, it ends up plopping what you need to see in a place that's covered by the static header.

Is it possible to use javascript (preferably jQuery) to intercept all hash jumps and add 100px to wherever it's going to take you?

[pritaeas]

Something like this? Not sure if the scrollTo can be used relative (never used it).

[stbuchok]

http://benalman.com/projects/jquery-hashchange-plugin/
https://developer.mozilla.org/en-US/docs/Web/API/window.onhashchange

Hope this helps.

[Dani]

Thanks guys! What's funny is I'm already using the hashchange trigger elsewhere and for some reason I was still blank!

Here's what I'm doing. Works like a charm:

$(window).on('hashchange', function() {
    var header = $('#static-header.fixed');
    if (window.location.hash != '' && header.length) {
        var position = $(window).scrollTop();
        $(window).scrollTop(position - header.outerHeight());
        return false;
    }
});