Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

link with href="#" scrolls page to top when used with jquery slidetoggle [duplicate]

Possible Duplicate:
How do I stop a web page from scrolling to the top when a link is clicked that triggers javascript?

I'm using jquery's slidetoggle to show/hide divs. the element that controls the sliding is a text link ( some text inside <\a>) which has href="#" so it will look like a link (underline, cursor change).

the problem is that when the link is clicked, in addition to the sliding effect, the page scrolls to top.

i tried replacing href="#" with href="" but that disables the div show/hide effect. i guess i could add to the tag Name="somename" and then set the href to href="#somename" but i would rather not use tricks like that.

why is href="#" scrolling the page to its top?

any ideas would be highly appreciated

like image 392
samoyed Avatar asked Jan 07 '10 23:01

samoyed


People also ask

How do I create a link in href?

To make a hyperlink in an HTML page, use the <a> and </a> tags, which are the tags used to define the links. The <a> tag indicates where the hyperlink starts and the </a> tag indicates where it ends. Whatever text gets added inside these tags, will work as a hyperlink. Add the URL for the link in the <a href=” ”>.

What is link href in HTML?

For <a> and <area> elements, the href attribute specifies the URL of the page the link goes to. For <base> elements, the href attribute specifies the base URL for all relative URLs on a page. For <link> elements, the href attribute specifies the location (URL) of the external resource (most often a style sheet file).

How do you pass a link in HTML?

HTML Link Syntax Links are specified in HTML using the <a> tag. A link or hyperlink could be a word, group of words, or image.

Why do we use href in HTML?

The HTML <a> href Attribute is used to specify the URL of the page that the link goes to. When the href attribute is not present in the <a> an element that it will not be a hyperlink. This attribute is used to specify a link to any address. This attribute is used along with <a> tag.


1 Answers

Several options:

  1. Put return false; at the bottom of your click handler and the href wont be followed.
  2. Change the href to javascript:void(0);
  3. Call preventDefault on the event in your handler:

    function( e ) {   e.preventDefault();   // your event handling code } 
like image 192
rfunduk Avatar answered Sep 28 '22 01:09

rfunduk