jQuery animate not work in Chrome and IE -

i created div container relative postitioned. in div container, there image displayed in block , responsive image , overlay div absolute positioned. because div container used in responsive website scenario, not have fixed dimension, instead, @ time, dimension determined dimension of image changing when size of screen changes.

when page loaded, part of overlay visible. when user's mouth hovers on overlay, rest of overlay needs displayed, , fill entire div container. use jquery animate implement animation , works expected in firefox, , not work in ie, , not work in chrome, ie , safari.

the following code, , can find live demo in jsfiddle: http://jsfiddle.net/spencerfeng/k9hdn/

here html:

<div id="container">     <img class="responsive-img" src="http://www.fubiz.net/wp-content/uploads/2013/07/one-ocean-one-breath14.jpg" alt="">     <div class="overlay">         <h1>this title</h1>         <div class="content">there many variations of passages of lorem ipsum available, majority have suffered alteration in form, injected humour, or randomised words</div>         <a class="link" href="#">see more</a>      </div> </div> 

here css:

#container {     width:400px;     margin-left:auto;     margin-right:auto;     position:relative; } .responsive-img {     width:100%;     height:auto;     max-width:100%; } .overlay {     position:absolute;     left:0;     right:0;     bottom:0px;     color:#ffffff;     text-align:center;     background: rgb(54, 25, 25);     background: rgba(54, 25, 25, .5);     padding:0 20px; } .content {      position:absolute;    } a.link {     position:absolute;     bottom:10px;     right:10px;     text-indent:-9999px;     text-decoration:none;     color:#ffffff; } 

here javascript:

(function($){      $('.overlay').hover(         function() {             $(this)                 .animate({                     top: '0'                 }, 300, function() {                     $(this).children('.link').css({'text-indent': '0px'});                 });         }, function() {          }     );  }(jquery));