17

Possible Duplicate:
jquery - disable anchor “jump” when loading a page

I'm displaying a div depending on the hash value in a URL but i want to avoid the page jumping to the postion of that div with that particular ID.

I only have the problem when the page is navigated direct with the hash in the URL so say for example if someone has book marked the page.

So for example I have the url domain.com/page.html#myitem-1

ID=myitem-1 will then display, which it does but the page then jumps down to the postion of that div which i don't want.

I was trying to use scrollTop(0) to force the window position back to the top but it seems as if this gets called before the anchor jump takes place to has no effect

Example code:

  $(document).ready(function() {
    $('.glossary-term').hide();
    $(window.location.hash).show();

    $(window).scrollTop(0);

});

The only way i was able to get this scrollTop to work was to place it in a setTimeOut with a duration of 1, but this seems like a bit of a hack. Any other suggestions?

Thanks

B

Community
  • 1
  • 1
Ben
  • 1,022
  • 3
  • 13
  • 23
  • Thanks guys thought clicking the up vote was enough. A few answers that didn't really help do i just ignore them? I've normally replied with a comment but not had a follow up. Thanks again. – Ben May 16 '12 at 21:32
  • hi Ben, how u have solved it pls? same problem i have – echo_Me Dec 16 '12 at 00:05

1 Answers1

11

Well, if it is your internal mechanism for using anchors just for displaying divs you can always change (or remove) the "name" attribute so the browser won't find it directly and won't try to scroll ;)

Otherwise try How to disable anchor "jump" when loading a page?

Community
  • 1
  • 1
Majki
  • 618
  • 7
  • 14
  • 1
    Thanks for the reply, there actually is no name tag, it's jumping there because the DIV has the ID of that. I guess strictly speaking it's not an anchor of such but same functionality. I would like to keep the ID's in place as means it degrades well when JS is disabled. The link looks like it's using same idea i was trying with the setTimeOut but does fell like a bit of a hack, maybe not and only way to go. – Ben May 16 '12 at 21:36
  • Well, if you set an anchor the browser WILL try to follow it, so you have to hack it somehow.. And have you tried reseting your anchor on page load? Like with 'window.location.hash = "";' or 'window.location.hash = "top";' – Majki May 16 '12 at 21:38
  • And have you tried reseting your anchor on page load? Like with 'window.location.hash = "";' or 'window.location.hash = "top";' $(document).ready(function() { $('.glossary-term').hide(); $(window.location.hash).show(); window.location.hash = ""; $(window).scrollTop(0); }); – Majki May 16 '12 at 21:43
  • Thanks Majki, that does work but problem being is the URL then becomes un bookmarkable so think I'll go with wrapping the scrollTop into a setTimeOut. But will mark this as answered as Both your comment above and link in answer helps. – Ben May 16 '12 at 22:14