Javascript 在jQuery中使用悬停函数在图像上显示div

我正在尝试在图像上创建一个图像库，当您悬停或鼠标悬停时，它将在图像上显示一个div，我在悬停功能上使用淡入/淡出功能。 问题是，当我悬停图像时，它会自动淡入淡出

$("#back").mouseenter(function() {
   $("#front").fadeIn(1000); 
});

$("#front").mouseleave(function() {
 $("#front").fadeOut(1000);   
});

我有一段悬停淡入/淡出代码：

$(".image").hover(function() {

    $(".hover-box").fadeIn({
        duration: 1000
    });

}, function() {

    $(".hover-box").fadeOut({
        duration: 1000
    });
});

---

我正在尝试解决我能做的事情，这样它只会在我将鼠标移到图像上时淡入，然后在鼠标离开图像时淡出。如何实现它？

离开.hover框而不是图像时，应该隐藏.hover框

$("#back").mouseenter(function() {
   $("#front").fadeIn(1000); 
});

$("#front").mouseleave(function() {
 $("#front").fadeOut(1000);   
});

---

似乎在为我工作。你能把这个问题的说明贴一个摆弄吗？或者一些额外的代码，这样我们可以看到发生了什么？我当然可以，但我想让你知道它会悬停在我的问题是，当我鼠标悬停在div上时，我想淡入淡出，当我鼠标悬停在图像上时，它会自动淡入淡出是的，因为鼠标离开了图像。因为。悬停框重叠了它#后面是你的.image，#前面是你的.hover框，.image失去焦点，.hover框获得新焦点，因为它在上面。祝你好运。我的朋友：）我对这个很陌生，呵呵，但是谢谢你的帮助：）谢谢：）