Javascript Jquery阻止堆叠元素悬停在外

我已经在这上面呆了很久了

$(".poster-wrapper.tint").hover(function () {
    $(this).siblings(".controls").slideDown('fast');
}, function (e) {
    //Here is where I need if statement. Only slide up if the poster **and** the controls class is not being hovered on
    $(this).siblings(".controls").slideUp('fast');
});

.controls

位于

.poster wrapper

的顶部，因此当我将鼠标悬停在poster wrapper上时，它会正确显示控件类，但当我将鼠标悬停在controls类上时，它们会再次滑开，因为海报不再悬停在上面。我如何阻止这种不必要的行为

我在这里查看了其他线程，但仍然无法为多个元素计算出它

---

jsFIDLE:

我在另一个StackOverflow问题上找到了解决方案

添加

指针事件：无到您的
控件
类

.controls{
  pointer-events: none;
  /* other properties */
}

更新

--使用单击事件进行更新--

将一个div放入另一个div中

 <div class="poster-wrapper tint">
      <div class="controls"></div>
    </div>



你能发布一个JSFiddle吗？@Jaydo Done。如果你在黑方格中来回悬停，向下滑动效果很好。如果你把鼠标悬停在中间的蓝色方块上，它会试图向上移动。我希望它即使在blue Square上也能保持显示，这也会禁用所有的click（）事件。我不想那样。是的，很不幸。如果您不介意将
.controls
放在
.poster wrapper
中，它会工作的。够好了，我从没想过。谢谢。@MartinMazzaDawson如果我解决了你的问题，你能接受我的回答吗？干杯