Здравствуйте. Решил реализовать такую вещь: при наведении на изображение, снизу выдвигается div с каким-то текстом. При реализации возник ряд проблем. Буду благодарен комментариям и возможным вариантом, как довести данный скрипт до ума.
index.html
<img class="img" src="images/4.jpg" alt="" width="400" />
<div class="image"><p>Описание изображения</p></div>
style.css
.image{
background: #359FBC;
opacity: 0.6;
color: #fff;
padding: 10px 0 19px 34px;
width: 366px;
margin: -57px 0 0;
}
script.js
$(document).ready(function (){
$('.image').hide();
$('img').mouseenter(function(){
$('.image').slideDown(function(){
$(this).show();
});
})
$('img').mouseleave(function(){
$('.image').slideUp(function(){
$(this).hide();
});
})
});