Javascript 将光标悬停在div上并显示其他div，但隐藏的div位于主容器的外侧

我试图在hover上显示一个div，它位于主容器的外侧，我发现大多数代码都是关于显示一个div的，它就在主容器的内侧，但是我想显示并隐藏一个div，它位于主容器的外侧

JS

---

此提琴用于悬停一个div并显示其内部的div，但是我们如何为一个div和另一个也在main div之外的div执行此操作，然后您可以更改此代码：

$(this).find(".overlay");

为此：

$(this).parent(".overlay")

或者，如果该类是您仅有的覆盖类，只需使用：

$('.overlay)

---

如果

.overlay

是该类的唯一

div

，则可以使用：

$('.overlay').fadeIn()

或

---

只有当您的div相邻而不是在内部时，才可以使用CSS执行此操作：

css html

关于游戏的信息
玩

这就是您想要的吗？是的，如果你解决了我的问题，那就太麻烦了；]使用这种类型的解决方案时，我建议始终停止队列。。如：$（this）.sides（'.overlay'）.stop（false，false.fadeIn（）；或者（假的，真的）哪个更适合你。。对淡出也要这样做（）。。如果您不这样做，并且多次来回悬停，您将看到元素不断出现/消失。@webkit，谢谢您的建议，我意识到了奇怪的闪烁效果。在小提琴上添加了

stop（）

。

$('.overlay').fadeIn()

$(this).siblings('.overlay')

    div.overlay { opacity:0; -webkit-transition:opacity 500ms ease; transition:opacity 500ms ease;}
    div.box:hover ~ div.overlay,
    div.overlay:hover {    opacity:1; height:100%;}

<div class="box">Info about a game</div>
<div class="overlay"> Play </div>