jquery - 悬停时更改图像，但不更改图像位置

我试图在悬停时更改图像，这应该很简单，但是由于某种原因，它并没有更改图像，所以我还注意到有一种抽搐。

jQuery的：

$('#first_default_circle').hover(
    function () {
        $(this).find('.default').hide();
        $('#first_default_circle_hover.default_hover').show();
    },
    function () {
        $('#first_default_circle_hover.default_hover').hide();
        $(this).find('.default').show();
    });

CSS：

.default {
     height: 86px;
     left: 280px;
     top: 50px;
     width: 86px;
 }
 img {
     position: absolute;
     background:#000;
 }
 .default_hover {
     display: none;
     height: 119px;
     left: 261px;
     top: 40px;
     width: 119px;
 }

Jsfiddle：http://jsfiddle.net/squidraj/Z6rNF/

感谢您的任何帮助，在此先感谢。

最佳答案

FIDDLE

JS

$("#circle").hover(

function () {
    $('.default').hide();
    $('.default_hover').show();
},

function () {
    $('.default_hover').hide();
    $('.default').show();
});

的HTML

<div id="circle">
    <img src="http://www.demo-pinksquid.co.uk/img/rewarding_icon_private_medical_insurance.png" class="default">
    <img src="http://www.demo-pinksquid.co.uk/img/rewarding_icon_private_medical_insurance_ho.png" class="default_hover">
</div>

或者，如果您更喜欢淡入淡出效果：

FIDDLE

关于jquery - 悬停时更改图像，但不更改图像位置，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18468640/