I'm feeling quite confused about this situation.
I've been attempting to utilize the slideDown function in jQuery, but when I click on the 'information' div, it just jumps instead of animating smoothly.
I suspect that one of the causes might be the properties set for the .information div:
The animations work fine when I remove the min-height property. However, I do want to keep the min-height intact.
Does anyone have any solutions or suggestions?
Check it out here: http://www.bootply.com/EXXhRTAECu
CSS:
.information {
margin-left: auto;
margin-right: auto;
/*border:1px solid #000;*/
border-top: 1px solid #000;
border-bottom: 1px solid #000;
width: 100%;
display: none;
background-color:#f2f2f2;
box-shadow: 1px 1px 1px #f2f2f2;
overflow: hidden;
min-height: 300px; /*When I remove this it works*/
height:auto;
}