David David - 4 years ago 181
Javascript Question

How can I remove the location hash without causing the page to scroll?

Is it possible to remove the hash from

window.location
without causing the page to jump-scroll to the top? I need to be able to modify the hash without causing any jumps.

I have this:

$('<a href="#123">').text('link').click(function(e) {
e.preventDefault();
window.location.hash = this.hash;
}).appendTo('body');

$('<a href="#">').text('unlink').click(function(e) {
e.preventDefault();
window.location.hash = '';
}).appendTo('body');


See live example here: http://jsbin.com/asobi

When the user clicks 'link' the hash tag is modified without any page jumps, so that's working fine.

But when the user clicks 'unlink' the has tag is removed and the page scroll-jumps to the top. I need to remove the hash without this side-effect.

Answer Source

I believe if you just put in a dummy hash it won't scroll as there is no match to scroll to.

<a href="#A4J2S9F7">No jumping</a>

or

<a href="#_">No jumping</a>

"#" by itself is equivelent to "_top" thus causes a scroll to the top of the page

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download