jquery - 将鼠标悬停在带有附加信息的 div 上滑动 - 如何？

Question

在http://snapguide.com上，当您将鼠标悬停在图像上时，一个额外的 div 会向上滑动，其中包含更多内容。

我想知道，是否有任何简单的方法可以实现这种效果......或者甚至有任何人都知道的 jQuery 插件或操作教程？我试图查看该网站的源代码，但对于触发效果的确切原因有点超出我的理解。

我试着在谷歌上搜索，但不知道效果到底是什么，所以我有点迷茫。感谢您的任何帮助 ：）

Answer 1

您可以尝试这种代码：

$(el).css({position: 'relative'})

$(el).hover(function(){
    $(this).animate({position: 'relative', top: '-20px'}, 1000)
}, function(){
    $(this).animate({position: '', top: ''}, 1000)
})

看看这个小提琴看看渲染。