CODEWITHSUNDEEP
jquery
Richard
Richard

Reputation: 1474

jQuery toggle activating on its own

Here's my code so far,

$("#mobile-menu").toggle(function(){
        $("#nav").animate({height:460},500);
      },function(){
        $("#nav").animate({height:65},500);
     });

I have a very similar set up on a different site and it works when clicking on $("#mobile-menu") to increase the height of the #nav tag, but in this case the code just starts up running when the page loads and causes the elements to animate away.

What am I missing here? Thank you

UPDATE

Here's my updated code, still not working as intend, the element just fades away. How is this done now with the new jQuery library?

$('#mobile-menu').click(function() {

        $("#nav").toggle(function(){
            $(this).animate({height:460},500);
          },function(){
            $(this).animate({height:65},500);
         });

    });

Upvotes: 0

Views: 65

Answers (2)

Arun P Johny
Arun P Johny

Reputation: 388406

As was said in the previous answer it is the result of the removal of support for toggle(function(){}, function(){})

var $nav = $("#nav");
$('#mobile-menu').click(function() {
    var toggle = $nav.data('toggle-state');

    $nav.stop().animate({
        height: toggle ? 460 : 65
    }, 500);
    $nav.data('toggle-state', !toggle);
});

Demo: Fiddle

Upvotes: 1

James Montagne
James Montagne

Reputation: 78690

Your other code is likely using an older version of jQuery. This version of toggle was deprecated in 1.8 and removed in 1.9. This is probably a result of the other toggle being called instead.

Toggle Event (removed in 1.9)

Toggle Effect

Upvotes: 3

Related Questions