Question

通常的问题是：“如何将鼠标悬停在一个上面并将thingOneFriend幻灯片打开？”

除此之外：“在鼠标离开任何一个元素之前，如何保持thingOneFriend打开？”

另外需要注意的是thingOneFriend不包含在thingOne中。

所以：

<div>
    <ul>
        <li><a href="blerg" id="#thingOne"></li>
        <li><a href="blarg" id="#thingTwo"></li>
        <li><a href="blorg" id="#thingThree"></li>
    </ul>
    <div id="thingOneFriend">I'm normally hidden</div>
    <div id="thingTwoFriend">Me too.</div>
    <div id="thingThreeFriend">Word.</div>
</div>

Fiddle Here

我试过了：

$(“#thingOne”).hover(function () {
    $("#thingOneFriend").slideToggle(400);
});

Answer 1

使用jQuery libary（在JS语言中）.mouseOver() method

以下是您的问题的示例：

<a href="#" id="hover">onHover this will open a little window</a>
<div id="hidden" style="display: none;">Hello</div>

和脚本：

$( "#hover" ).mouseover(function() {
    $( "#hidden" ).css( "display", "block" );
});
$( "#hover" ).mouseout(function() {
    $( "#hidden" ).css( "display", "none" );
});

当鼠标离开链接时，您可以使用onmouseout隐藏可见性。您可能还会阅读方法.css()

http://jsfiddle.net/m7nqoqpr/1/

将鼠标悬停在链接上，切换div可见性，直到鼠标离开BOTH链接和div

1 个答案: