Reputation: 184
I have placed some links in my webpage to which I have set click
event handler using jQuery. So when any of these links is clicked a menu will be displayed with .slideDown()
method but the problem I'm having is that after clicking a link the window gets automatically scrolled to top.
I have't used scrollTo(0,0)
still the window is getting scrolled. This automatic scrolling to top is not desired and should not happen.
I have tried the following still its not working as desired.
document.body.scroll(false);
document.body.scrollTop(0);
I have attached 2 images. image1 is normal webpage and image2 is the same webpage when Softwares-2
link is clicked and window is srolled to the top (as can be seen by the scrollbar on the right).
Note: numbers specified in the images are just to show that the window is getting scrolled.
Upvotes: 1
Views: 11221
Reputation: 105019
You have to prevent default link click behaviour (which is: make a request of the resource defined by the href
attribute value and load response) in your click event by doing this:
$("a").click(function(evt) {
evt.preventDefault();
// display your menu
// and do what's required
});
Usually people also suggest to return false;
from your handler, but that's not necessary. Still you can do that just before the closing curly brace of the click event handler function.
Upvotes: 8
Reputation: 17476
Add an return false
statement like below.
<a href="#" onclick="function();return false;">Link</a>
Upvotes: 2
Reputation: 12052
event.preventDefault and return false inside your .click handler should fix it up for you.
Upvotes: 1