图像链接翻转效果

Question

是否有人知道如何使图像链接翻转效果与here相似？可能有一个教程吗？改变背景的不透明度并使眼睛看起来很容易，但我不知道开发人员如何让奶酪轮子像这样滑动。

截图：

Answer 1

这是两件事的组合：

一个是在悬停时改变楔形的位置（在CSS中）。我猜你知道怎么做。

另一个（创建动画的那个）正在指定转换时间，以便它可以平滑地从一个状态移动到另一个状态。

有关转换如何工作的详细信息，请参阅http://www.w3schools.com/css3/css3_transitions.asp。

不幸的是，跨浏览器支持很差，每个浏览器都使用它自己的前缀。您指向的网站使用：

-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;`