HTML - 翻转图像上的破碎图像

Question

<a href="http://pipleklo.tk/DONE.jpg">
<img src="http://pipleklo.tk/DONE.jpg" onMouseOver="this.src='http://pipleklo.tk/me.png'" onmouseout="this.src='http://pipleklo.tk/DONE.png'">
</a>

这是我的示例代码。当您第一次加载我的“关于我”网页时，它会显示一个损坏的图像，直到您单击它为止。

但是当你将鼠标移到它上面时，它会立即修复并保持固定状态。但破碎的图像看起来很难看，我想知道它为什么会发生。

Answer 1

简单地将文件扩展名从jpg替换为png：

http://pipleklo.tk/DONE.png

上述文件存在于您的服务器上，但不存在jpg的文件。