Плавное изменение высоты при наведении
 

Есть макет http://skrinshoter.ru/s/120718/NWdGGpoo
При наведении на блок его картинка превращается в слайдер (как я понимаю). Я реализовал это таким образом: картинка прячется с помощью hide() и потом с помощью css показываю слайдер.
Конечно можно это и как то по другому сделать...

Также при наведении на блок в нем появляется дочерний блок с доп параметрами, при этом он наезжает на внизу стоящего соседа (как это изображено на картинке) и сосед не отскакивает вниз.

Хотел реализовать это с помощью css, но плавно не получилось. Как сделать чтобы это происходило плавно?
Почему то метод hide не срабатывает.

https://codepen.io/anon/pen/MBwBve