CODEWITHSUNDEEP
jqueryhtml
Julie
Julie

Reputation: 263

Jquery Slide problem

I have this code and want a panel on my page to slide when a link is clicked.

But the problem is that the page jumps to the top. Is there any way to stop the page from jumping to the top?

$(document).ready(function(){
      $("[href='#']").click(function(){
        $("#message_panel").slideToggle("slow");
      });
  });

Here's the code I have somewhere down on the same page.

<a href="#" ><span>more</span></a>
       <div id="message_panel" class="nodisplay">
        message here.
 </div>

Upvotes: 0

Views: 69

Answers (3)

Mikael &#214;stberg
Mikael &#214;stberg

Reputation: 17156

The jumping issue is because you are using '#' as the link. Start using Javascript:void(0) in those cases instead.

Upvotes: 0

Matschie
Matschie

Reputation: 1247

$("[href='#']").click(function(e){   
     e.preventDefault();
     $("#message_panel").slideToggle("slow");       
});

e.preventDefault() should do the trick

Upvotes: 0

Simon Lang
Simon Lang

Reputation: 42655

$(document).ready(function(){
      $("[href='#']").click(function(e){
e.preventDefault();

        $("#message_panel").slideToggle("slow");
      });
  });

Upvotes: 1

Related Questions