JQuery () animation height not working

Question

I just created this: jsfiddle.net/MWzDe/ ,

JS:

$('button').click(function () { if ($('ul').height = 0) { $('ul').animate({'height':'100%'},'slow'); } else { $('ul').animate({'height': 0},'slow'); }}); 

I need to move the tag 'ul' up / down without 'really' to disappear. What is wrong with the code? doesn't do it yet. thanks.

Answer 1

.height is a function: use $('ul').height() to get a height like this

 if ($('ul').height() == 0) { } 

Answer 2

You can achieve this using slideToggle .

Try the following:

 $('button').click(function () { $("ul").slideToggle("slow"); }); 

Fiddle: http://jsfiddle.net/MWzDe/3/

Answer 3

Try:

 $('button').click(function () { $('ul').animate({ 'height':'toggle' }, 'slow'); }); 

Feed here

Answer 4

since you are using jquery, why not use .slideToggle() ?

 $('button').click(function() { $('ul').slideToggle('slow'); }); 

Answer 5

Use slideToggle ()

DEMO VIEW

 $('button').click(function () { $('ul').slideToggle('slow'); }); 

Answer 6

Just use the .slideToggle function. DEMO HERE

 $('button').click(function () { $('ul').slideToggle(); }); 

Answer 7

the following code uses animation

 $('button').on(click, function() { $('ul').animate({height: 'toggle'},'slow'); })