实现网站按钮的效果

Question

我正在尝试创建类似于我在网站上看到的效果。我所说的效果是“查看详细信息”按钮。

以下是链接：http://www.legworkstudio.com/

有人可以告诉我这是怎么做的，或者这是一些JavaScript或jQuery的插件吗？

Answer 1

它可以为一系列背景设置动画效果。

https://legsite-production.s3.amazonaws.com/assets/desktop/sequences/detail-open/detail-open-00-aae01190cedcd36764097f5ff4765c27.png   
https://legsite-production.s3.amazonaws.com/assets/desktop/sequences/detail-open/detail-open-06-c56f3ce86232e1ca38660cf108a0f2e0.png   
etc

我用jQuery编写了一个解决方案：JSFiddle

您无法使用CSS keyframes的解决方案，因为如果不在Google Chrome中，则不支持background-image。 你应该使用一个精灵，但是很难让它反应灵敏。

这是@keyframes http://jsfiddle.net/DNXJX/（仅限Chrome）

的示例