Jquery / hover并更改img

Question

当我悬停图片时，我使用下一个，以便更改图片：

<img id="image1" src="imimage.jpg" alt="facebook.com">

$('#image1').hover(function() {
    $('#image1').attr('src', 'imanewimage.jpg');
}, function() { 
    $('#image1').attr('src', 'imimage.jpg'); 
}); 

但是真的很奇怪：当我加载HTML时，加载了imimage.jpg。但是当我悬停它时，imimage.jpg不会加载，只显示alt属性。

可能是什么原因？

Answer 1

上面的代码是正确的，alt标签正在显示，因为图片很可能不在正确的位置。根据您的代码，图像应与您的页面位于同一目录中。

使用来自互联网的图像进行测试（您说它们正在工作），必须是文件位置问题。

Answer 2

你可以通过使用css来改变图像而不是javascript来简化这一点，这将使它更加普遍兼容并且更容易编码......

<div class='imageToHover'></div>

.imageToHover {
   /*you probably want some height/width stuff in here too*/
   background-image: url(imimage.jpg);
}
.imageToHover:hover {
   background-image: url(imanewimage.jpg);
}