use*_*644 1 html javascript css jquery jquery-animate
我编写了以下代码来更改鼠标悬停时的图像源.它改变了图像src,但效果是如此不稳定.OnMouseOver它突然改变了图像.
请告诉我如何减慢动画的效果.
<script>
$(document).ready(function(){
$("#image").hover(function(){
$(this).attr("src","images/pic2.png")
}, function(){
$(this).attr("src","images/pic1.jpg")
});
});
</script>
</head>
<body>
<img id="image" src="images/pic1.jpg">
</body>
编辑
http://jsfiddle.net/MKuvn/
你可以在jQuery中使用fadeOut和fadeIn效果:
$(document).ready(function(){
$("#image").hover(function(){
$(this).fadeOut(1000,function(){
$(this).attr("src","images/pic2.png");
$(this).fadeIn(1000);
});
}, function(){
$(this).fadeOut(1000, function(){
$(this).attr("src","images/pic2.png");
$(this).fadeIn(1000);
});
});
});