To provide a sneak peek of the content in the div, I have minimized it so only the first line is visible. Now, I want to add an animation that will expand the div to 100% height when you click the title. However, using animate(height:"100%") does not result in a smooth sliding effect.
<a href="javascript:void(0);" class="show_it">title:</a>
<div>
content<br>
content_hidden
</div>
<script>
$('.show_it').click(function() {
$(this).next("div").animate({
height: 'auto'
}, 1000, function() {
});
});
</script>
<style>
div{
height:20px;
overflow:hidden;
}
</style>