我想知道并已四处搜寻，找不到答案。现在，我正在悬停时使用jQuery更改背景图片。是否可以在其中添加过渡时间？像褪色一样？ie8兼容吗？
这是代码：
$('.logo').hover(function() {
$(this).css("background","url('url') no-repeat");
},function() {
$(this).css("background","url('url_hover') no-repeat");
});
由于背景图像源不是渐变的属性，因此可以在所有元素后面放置两个模拟背景，并在悬停时淡出一个背景，以揭示其后面的背景。
你可以做这样的事情-jsFiddle演示
的HTML
<div class="bgFadeToggle">
<h1>Hello World</h1>
<div class="bg"><img src="image-1.jpg" /></div>
<div class="bg"><img src="image-2.jpg" /></div>
</div>
JS
$('.bgFadeToggle').hover(function(){
$(this).find('.bg:first').stop(true).fadeToggle();
});
的CSS
.bgFadeToggle {
position: relative;
z-index: 9999;
}
.bgFadeToggle .bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.bgFadeToggle .bg {
z-index: -9998;
}
.bgFadeToggle .bg + .bg {
z-index: -9999;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句