CODEWITHSUNDEEP
javascriptjqueryhtmltoggle
Tedi
Tedi

Reputation: 1

jQuery: How do I trigger .slideToggle() on links?

How do I perform a jQuery 'slidetoggle' effect using a hyperlink, instead of an input button, as the action item?

At the jQuery reference page

It only gives an example of using a form input button.

I would like to have instead of a button, a hyperlink to be the toggle clickable action.

Upvotes: 0

Views: 3809

Answers (3)

Kobi
Kobi

Reputation: 138017

In addition to the other answers, if your hyperlink has an href attribute (which it should, so it will be displayed as a link), you may want to neutralize it by returning false on your event handler (if you don't, the page will scroll up when you click on the link):

$('a').click(function(){
    $('p').slideToggle();
    return false;
});

Other than that, there shouldn't be any difference between a button and an hyperlink. While you're reading the documentation, you'd be wise to start with jQuery's Selectors.

Upvotes: 1

XVargas
XVargas

Reputation: 1512

If you have a link like so:

<a id="toggleLink" href="#">CLICK ME!</a>

Just use the following function to slideToggle your div

 $("#toggleLink").click(function () {
      $("#myDiv").slideToggle("slow");
    });

Upvotes: 1

rahul
rahul

Reputation: 187030

$("#anch").click(function () {
      $("#para1").slideToggle("slow");
    });



<a id='anch'>Toggle</a>
  <p id='para1'>
    This is the paragraph to end all paragraphs.  You
    should feel <em>lucky</em> to have seen such a paragraph in
    your life.  Congratulations!
  </p>

Upvotes: 1

Related Questions