CODEWITHSUNDEEP
jqueryhtml
Kali
Kali

Reputation: 613

Smooth toggle effect in jquery

I'm trying to let the transition when you click the button smoother, but it's not working, I tried to add $slideToggle, but I think I did it wrong.

<button class="btn btn-warning" id="btn-mob">
<div id="rec-div" style="display: none;">
  test
</div>

<script>
  $("#btn-mob").click(function() {
    $("#rec-div").toggle();
    $("#rec-div").slideToggle(1500);
  });
</script>

Upvotes: 0

Views: 830

Answers (1)

Alain Cruz
Alain Cruz

Reputation: 5097

So I tried your code and it works. Just one thing, you need to remove the additional toggle(), before the slideToggle(). Is this the intended animation?

 $( "#btn-mob" ).click(function() {
  $("#rec-div").slideToggle(1500);
}); 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="btn btn-warning" id="btn-mob">
<div id="rec-div" style="display: none;">test</div>

Upvotes: 2

Related Questions