CSS3上滑效果

Question

我只是想知道如何从这个website复制此效果，稍微重叠的描述框会在悬停时向上滑动。有没有办法在CSS3或Jquery中执行此操作？我已经尝试使用示例网站中的相同代码，但它有条形图像的网站，我似乎无法删除。

任何帮助表示感谢。

Answer 1

试试这个：

.container {
  width: 300px;
  height: 150px;
  position: relative;
  background: yellow;
  overflow: hidden;
}

.description {
  width: 300px;
  height: 100px;
  position: absolute;
  bottom: -60px;
  transition: all .2s ease-in;
  background: orange;
}

.container:hover .description {
  bottom: 0;
}

<div class="container">
  <div class="description">
   <p>Hover for more info.</p>
   <p>Hello there.</p>
 </div>
</div>