jquery Image slide down on hover

using bootstrap framework

by ravimallya

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css">
<script src="https://raw.github.com/twitter/bootstrap/master/docs/assets/js/bootstrap.min.js"></script>
<div class="container">
    <div class="row">
        <div class="span3">
        </div>
        <div class="span6">
            <div class="row">
                <div class="span6">
                  <div class="advtImg">

                </div>
            </div>
        </div>
        <div class="span3">
        </div>
    </div>
</div>

CSS

.advtImg
{
height:60px;
    width:100%;
    background-color:red;
    border:1px solid green;
    background:transparent url("http://www.oranjuice.net/files/image_events/clapton_advt-2_use.jpg") no-repeat left bottom;
    
}

JavaScript

$(document).ready(function() {
                $(".advtImg").hover(function(){
        $(this).animate({height: '400'}, 500);
    },function(){
     $(this).animate({height: '60'}, 500);  
    });
            });