Karthik
Karthik

Reputation: 184

how to disable autoscrolling to top using jquery?

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.

image1 image2

Upvotes: 1

Views: 11221

Answers (4)

SunMercury
SunMercury

Reputation: 1

$(document).ready(function() {

....

return false;
});

Upvotes: 0

Robert Koritnik
Robert Koritnik

Reputation: 105019

Your page is in fact reloading and not scrolling

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

user482594
user482594

Reputation: 17476

Add an return false statement like below.

<a href="#" onclick="function();return false;">Link</a>

Upvotes: 2

Dan F
Dan F

Reputation: 12052

event.preventDefault and return false inside your .click handler should fix it up for you.

Upvotes: 1

Related Questions