这里我的代码完美运行,但我希望当鼠标悬停在按钮上时,img 标签和新类的更改将平滑淡入。那可能吗?
jQuery:
$('.hover').mouseenter(function() {
$(this).next().removeClass('hide')
var src = $(this).attr("src").match(/[^\.]+/) + "_hover.svg";
$(this).attr("src", src)
});
$('.hover').mouseleave(function() {
$(this).next().addClass('hide')
var src = $(this).attr("src").replace("_hover.svg", ".svg")
$(this).attr("src", src)
});
HTML:
<div class="facebook">
<a href="#">
<img class="fb_logo hover" src="img/facebook_logo.svg" alt="Facebook Logo" />
<img class="fb_text hide" src="img/facebook_text.svg" alt="Facebook Text" />
</a>
</div>