将图片翻转到另一张图片中

Question

我试图让图像在用鼠标悬停时有一个翻转动画。 有点像一张幸运卡翻转，除了一面是一张图像，另一面是另一面图像。我有什么想法吗？

<img src="image1.jpg" onmouseover="this.src='image2'" onmouseout="this.src='image1'" />

我正在网上查找它，我看到如何使图像旋转但不会翻转到另一个图像。任何想法如何让我开始将不胜感激

Answer 1

我建议您查看this article。

基本上，您想要做的是将两个图像作为单独的图像对象

<img src="image1.jpg"/>
<img src="image2.jpg"/>

要切入的东西（在文章的情况下，锚点）

<a href="index.html" onMouseOver="SwapOut()" onMouseOut="SwapBack()"> 

最后存储它（另一张图片）

<img name="flippr" src="image1.jpg"></a>

Answer 2

我相信这个资源概述了您尝试实现的效果。相当强烈的解释。 http://guilhemmarty.com/flippy/