CSS/jquery animation on click
HTML
<div id="collapseTwo" class="cross">
<div class="panel-body">
<div class="inner rotate">
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
<div> Hassan NAseer Ahmad
</div>
</div>
</div>
</div>
CSS
img {
display: block;
margin: 20px;
}
img {
-webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 1s;
transition-duration: 1s;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: transform;
}
JavaScript
$( ".cross" ).click(function() {
//alert($( this ).css( "transform" ));
if ( $( this ).css( "transform" ) == 'none' ){
$(this).css("transform","rotate(90deg)");
} else {
$(this).css("transform","" );
}
});