css height transition onClick :active

I want to make a button and a div that when I click on the button, t开发者_运维知识库he div appears sliding down. When I click on the button again, the div disappears sliding up.

I know how to do it for 1 element but since there's two involved I am a little lost.

Edit: No Jquery because this is for a mobile web and it can't handle it.

The way to do this is to set the onClick method in js to change the class of your div.

In CSS, use this

#savemenu {-webkit-transition: height .25s}
.mobmenu.dropup {height: 0; overflow: hidden; border: none;}
.mobmenu.dropdown {height: 50px;}