вопрос
Помогите сделать показ блока при наведении на картинки вот как на этом сайте http://ghetto-live.ru/
<div class="img-content" style="top: 222px; ">
<a href="http://ghetto-live.ru/album/947-supa-villain-i-10-exit-34.html"><b class="img-2">Читать полностью</b></a>
<a class="img-1" onclick="document.getElementById('Supa Villain - I-10 Exit 34').style.display='block'; return false;" href="">Быстрый просмотр</a>
</div>
.img-content {float:left;position:absolute;background:#000;height:100%;width:100%;opacity: .8; /* For IE 5-7 */filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);/* For IE 8 */-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";top:222px;}img-content h2 {font-size:24px;color:#fff;padding:16px;margin-bottom:60px;}a.img-1 {float:left;clear:both;width:150px;margin:0 16px 8px 35px;background:url(../mpk-img/btn-img.png) 0 -31px no-repeat;color:#ffffff;text-decoration:none;text-align:left;font-size:12px;padding:8px 0 8px 10px;font-size:12px;font-weight:bold;}.img-2 {float:left;clear:both;width:150px;margin:80px 16px 8px 35px;background:url(../mpk-img/btn-img.png) 0 0 no-repeat;color:#ffffff;text-align:left;font-size:12px;text-decoration:none;padding:8px 0 8px 10px;font-weight:bold;}a:hover.img-1 {background:url(../mpk-img/btn-img.png) 0 0 no-repeat;}.img-2:hover {background:url(../mpk-img/btn-img.png) 0 -31px no-repeat;text-decoration:none;}
<!--активация блока при наведении на изображение-->
<script type="text/javascript">
$(document).ready(function(){
//To switch directions up/down and left/right just place a "-" in front of the top/left attribute
//Vertical Sliding
$('.img-h').hover(function(){
$(".img-content", this).stop().animate({top:'0'},{queue:false,duration:300});
}, function() {
$(".img-content", this).stop().animate({top:'222px'},{queue:false,duration:300});
});
});
</script>
<!--активация блока при наведении на изображение-->
