Animating div from bottom to top, not top to bottom in jQuery

I have divone that animates it heightwhen the click function starts:

$('#menu').click(function() {
  $('#test').animate({
      height: 'toggle'
    }, 290, function() {    
  });
});

still working. But I want to animate divfrom bottom to top, and unlike what I saw in this fiddle .

Any solution?

+5
source share
1 answer

Can you put it in a container and install it absolutely ?:

HTML:

<a href="#" id="menu">click me for menu</a>
    <div id="cont">
    <div id="test"></div>
</div>

CSS

#cont{
    height:500px; width:50px; position:relative;
}
#test{
    height: 500px; width: 50px; background-color: #000; display: none; position:absolute; bottom:0; left:0;
}

JavaScript:

$('#menu').click(function() {
    $('#test').animate({
        height: 'toggle'
        }, 290, function() {
    });
});

Fiddle

:
position:relative. , (#test), position:absolute, , top, right, bottom left ( position, , a relative). a top:0;left:0 , , top:0;bottom:0, . , ? , , #test "" , . , ! #test, , , , #test 500px .

+12

All Articles