Question

Can I specify an y offset in the url path when I use bookmarks ?

Let’s say I have this path: mywebsite.com/mypage#bookmark

I would like to center the bookmark section in the middle of the page and not in the top.

I was wondering if I can specify something like ..mypage#bookmark&y-offset=100

maybe i can use javascript to get that value..
thanks

Answer 1

There is no native way to do this, but what you can do is define a separator between the ID and the offset, e.g. /, then parse it out.

For example:

/path/to/page#id/200

Then you can parse the value out and manually move it forward. Note that I don’t know how to trigger this as an event if you’re already on the page and moving to an anchor on the page (please fill me in anyone?)

function moveToHash() {
    function offset(node) {
        var x = 0, y = 0; do {
            x += node.offsetLeft;
            y += node.offsetTop;
        } while (node = node.offsetParent);
        return {x: x, y: y};
    }
    var id = location.search.match(/([^\/]+)/)[1];
    var offset = location.search.match(/\/(.+)/)[1] * 1;
    var nodeOffset = offset(document.getElementById(id));
    window.scrollTo(nodeOffset.x, nodeOffset.y);
    window.scrollBy(0, offset);
}