我需要一种使用 attr
更改图像源的方法,它还会提供淡入淡出效果。我已经尝试了我在这里找到的其他答案之一,但没有达到预期的效果。
这是它目前的样子: http://jsfiddle.net/zeaVx/
您可以注意到整个画面是如何在拍摄另一张图片之前完全淡出的。这不是我需要的。我需要即时更改,就像 CSS 的 :hover
但只有淡入淡出的效果。
我怎样才能做到这一点?
最佳答案
创建 2 个独立的 </img>
标签,将它们包裹在一个容器中,将一个放在另一个之上,然后简单地淡入/淡出顶部图像。
HTML
<div class="button-container">
<img src="http://i.imgur.com/q4A2GtV.png" />
<img src="http://i.imgur.com/jztqeIv.png" />
</div>
CSS
.button-container {
position: relative;
}
.button-container img {
position: absolute;
left: 0;
top: 0;
}
JQuery
$('.button-container').hover(function () {
$(this).find('img:last-child').stop().fadeOut();
}, function () {
$(this).find('img:last-child').stop().fadeIn();
});
关于javascript - 用效果改变属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19726110/