Jquery 图像淡入/淡出

Jquery 图像淡入/淡出,jquery,animation,fadein,fadeout,Jquery,Animation,Fadein,Fadeout,我有两个图像类用于菜单(img.b和img.a)叠加,默认情况下img.b位于上方,透明度为0,我需要使img.a淡出,而另一个淡入。。像我的代码一样,img.a保留在淡入的代码下面(这两个类都是透明的,所以你可以一个一个地看到它们)。。我尝试了几种解决方案,但最终我把所有的按钮都影响到了一起 <script type='text/javascript'> $(document).ready(function(){ $("img.b").hover( function() { $(t

我有两个图像类用于菜单(img.b和img.a)叠加,默认情况下img.b位于上方,透明度为0,我需要使img.a淡出,而另一个淡入。。像我的代码一样,img.a保留在淡入的代码下面(这两个类都是透明的,所以你可以一个一个地看到它们)。。我尝试了几种解决方案,但最终我把所有的按钮都影响到了一起

<script type='text/javascript'>
$(document).ready(function(){
$("img.b").hover(
function() {
$(this).stop().animate({"opacity": "1"}, "fast");
},
function() {
$(this).stop().animate({"opacity": "0"}, "fast");
});
});
</script>


img.a {
    z-index: 1;
    position:absolute;
        }

img.b {
    position:absolute;
    opacity: 0;
    z-index:10;
    }

$(文档).ready(函数(){
$(“img.b”)。悬停(
函数(){
$(this.stop().animate({“不透明”:“1”},“快速”);
},
函数(){
$(this.stop().animate({“不透明”:“0”},“快速”);
});
});
img.a{
z指数:1;
位置:绝对位置;
}
img.b{
位置:绝对位置;
不透明度:0;
z指数:10;
}
这类似于。您正在尝试的是交叉衰落。解释得很好

你也可能对这一点感兴趣

真正的问题是,由于JavaScript是单线程的,所以很难在JavaScript中真正实现交叉淡入淡出。所有的“交叉淡入”插件等,要么只是淡出顶部元素,要么在背景中快速闪烁,以此来伪装。i、 e在500毫秒内淡出一幅显示背景的图像半毫秒,然后在500毫秒内立即淡入新图像

如果您有两个透明的图像,如果不使用通过背景技术的人造交叉淡入淡入淡入淡入淡入淡出淡入淡入淡出淡入淡出淡入淡出淡入淡出淡入淡出淡入淡出淡入淡出淡入淡出淡入淡出淡出淡入淡出淡出淡入淡出淡出淡


使用一些方法可能会得到一个真正的交叉淡入淡出,但这比一个简单的jQuery淡入淡出调用要复杂得多。

此表单中的悬停已从jQuery 1.9+使用中删除,您能否编辑您的问题,因为我不清楚实际的问题/问题,因为它实际上是img.b淡入img.a之上(可以在下面看到)…不能使img.a淡出而imb.b淡入,希望它clearer@MarkSchultheiss-你确定
.hover()
已被删除吗?他们说
“hover”伪事件
,不是函数:谢谢,我将尝试以不同的方式解决此问题