CSS:
.slider, .slider img {width:460px;position:relative;}
.slider .slider-wrap {position:absolute;bottom:0;padding:10px;color:#fff;text-shadow:1px 1px 1px #000;}
.slider p {
overflow:hidden;
max-height:0;
-webkit-transition:.2s linear all;
-khtml-transition:.2s linear all;
-moz-transition:.2s linear all;
-ms-transition:.2s linear all;
-o-transition:.2s linear all;
transition:.2s linear all;
filter:alpha(opacity=0);
-khtml-opacity:0;
-moz-opacity:0;
opacity:0
}

.slider:hover p {
max-height:100px;
filter:alpha(opacity=100);
-khtml-opacity:1;
-moz-opacity:1;
opacity:1
}


HTML:



Article title


Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores quis, nulla tenetur maxime similique animi labore incidunt soluta? Quae quo recusandae velit est, consequuntur quasi sed sunt corporis voluptates cumque...

http://jsfiddle.net/tehet/Lsjyp1kn/

Veya onedionun kendi kodlarını da kullanabilirsin.
http://jsfiddle.net/tehet/55wajqLt/