Question

我正在尝试将鼠标悬停在图像上（sweden-a.gif），然后它变成其他东西（sweden-b.gif），但我想让新图像比原始图像更大。这是我的代码，但它不起作用，有人可以帮助我看看问题是什么？谢谢！

<img class="gdp-cirlce" src="img/sweden-a.gif" style="position:absolute; height:93px;" onmouseover="this.src='img/sweden-b.gif' this.style='height:123px'" onmouseout="this.src='img/sweden-a.gif'">

Answer 1

你可以使用jquery来做到这一点。

HTML：

<img src="..."/>

使用Javascript：

$('img').mouseover(function() {
    $(this).attr('src', your_src);
    $(this).css('width', your_width);
    $(this).css('height', your_height);
});

更新：

Code

Answer 2

确保您引用了JQuery库。如果它已被引用，请尝试将上述代码添加到document.ready函数中，如下所示：

$(document).ready(function(){

$('#sweden').mouseover(function() {
$(this).attr('src', 'img/sweden-a.gif'); 
$(this).css('height', '123px');
});

});

Onmouseover加上大小变化

2 个答案: