0

首先让我声明我是一个 jquery 菜鸟，所以这可能没有多大意义。

所以我有一系列列表项，如果用户将鼠标悬停在项目内的链接上（而不是整个列表项本身），它们会展开以显示隐藏的 div

问题是，如果用户鼠标离开链接，li 会再次关闭。

我需要它以某种方式工作，以便仅当您将鼠标悬停在另一个 li 中的链接上时 li 才会关闭。（对不起，这有点难以形容）

这是我的代码。

$(document).ready(function(){
                $(".home_upcoming_title").hoverIntent({
                over: makeTall, 
                timeout: 500, 
                out: makeShort

        });
    }); // close document.ready

    function makeTall(){$(this).parents("li").animate({"height":200},200);}
    function makeShort(){$(this).parents("li").animate({"height":32},200);}

和 HTML

    <li class="p1">

            <ul class="home_upcoming_list2" id="fade">
            <li class="home_upcoming_date">Sat.Sept.23rd.2010</li>
            <li><a href="./." class="home_upcoming_title" >Event Title</a></li>
            <li class="home_upcoming_city">Los Angeles</li>
            <li class="home_upcoming_type">Festival</li>
            <li class="home_upcoming_venue">Venue</li>
            <li class="home_upcoming_age">18+</li>
            <li><a href="./." title="Buy Tickets" class="home_upcoming_tix">Buy Tickets</a></li>
            <li><a href="./." class="upcoming_info" title="View Details"></a></li>
            </ul>

        <div style="height:150px; background-color:#FF0000; display:block;" class="sl0w"></div>
        </li>

因此，“home_upcoming_title”类的链接扩展了 li 以显示内部的 div，但是当我将鼠标悬停在 div 本身上时，列表关闭。我也需要它，所以只有“home_upcoming_title”类扩展了 div。但它需要保持打开状态，直到您将鼠标悬停在具有同一类的另一个链接上。

对不起，如果这没有多大意义:)

4

3 回答 3

1

有一个closeTips调用makeShort所有工具提示的函数，然后使用.mouseover()而不是.hoverIntent()运行closeTips，然后调用makeTall.

于 2010-12-21T19:47:58.177 回答
1

我看到你正在使用 hoverIntent 插件，并且 AFAIK 插件没有你想要做的事情，也许你需要更改插件基本代码来完成你想要的。或者尝试使用本机事件mouseover mouseout来做你想做的事，但这需要你做更多的编码。

于 2010-12-21T19:49:15.077 回答
0

我建议尝试使用jQuery UI Accordion。有一个选项可以在鼠标悬停事件上触发它。请参阅链接右侧的“鼠标悬停时打开”。

这是否回答你的问题？

于 2010-12-21T19:48:37.467 回答