Clicking on hyperlink causes page to jump to the top
I found a fix to an issue that was driving me nuts. If I told a jquery do run an animation when I clicked on a hyper-link the page would “magically jump” to the top of the screen. When the page was “jumping” to the top of the screen the jquery animation was actually happening. By the time you scrolled down back to down the page you would only see that the object had moved.
Up until now I would just write something like:
- <a href=”#”>Click me</a>
While doing this isn’t an issue if the jquery animation happens at the top of the page, if you want to run an animation somewhere down the page the jumping result is really unwanted.
Thanks to http://corpocrat.com/2009/07/12/fix-jquery-onclick-browser-jumps-to-top-of-page/ I realized I need to change the code so that it looks like this:
- <a href=”javascript:void(0);” onclick=”dofunc()”>Click me</a>
Hope this helps you if you are experiencing the issue where clicking on a hyperlink causes the page to jump to the top of the screen.
One other way to do this would be to assign a function for onclick that returns false. Returning false stops the event from propigating upwards. This stops the default action of an anchor tag (going to the top).