如何在两个部分中切换？

Question

超级简单的概念。看这里，http://jquerytest.thepeoplesmarketing.us/jquerydev/index2.html。灰色的div是一个“幻灯片”。我想要5个从左到右(没有问题)，在悬停时，每个都“动画”红色的div，这是当前在悬停时可见的例子。

显然，问题是当我切换红色div时，我的悬停焦点会切换到它，从而取消切换它。我怎么才能让它在我鼠标移出整个父div之前不“取消切换”呢？

(免责声明；相当极端的JS/JQ新手，具有强大的蟒蛇背景，所以请原谅我的愚蠢)

Answer 1

显示的红色div位于hover-element的顶部，因此失去了hover。将红色div放在hover-element中，如下所示：

<div id="box1" class="boxclass">
    <div id="msgbox" class="hideplz" style="display: none;"></div>
</div>

*或者你可以在灰色的div上做'mouseenter‘，如果你不能改变html结构，在红色的div上做'mouseout’。

Answer 2

如果你使用带有"hover“状态的jQuery，你必须改变这一点。您将需要一个用于悬停在灰色div上的函数，然后检查红色div之外的悬停以再次隐藏它。

您还可以检查红色div的状态(如果它显示或未显示)，因为如果它没有显示，您可能也想在灰色div上触发houver。

编辑:同时检查Syon的答案。我不认为你可以这样做，因为你可能会有多个灰色的div，但如果你有，那就去做吧。