菜单的jQuery延迟

Posted 2023-05-08

【中文标题】菜单的jQuery延迟

【英文标题】：jQuery delay for menu

【发布时间】：2012-03-11 02:34:32

【问题描述】：

有人可以解释当鼠标从#categories_block_top .tree ul 出来时如何延迟下拉？抱歉，我是 jQuery 的新手。这是链接 - http://livedemo04.prestatrend.com/ 和 js 文件，菜单是 treeManagementTop.js。

【问题讨论】：

您应该在问题中发布一些代码。特别是对于未来的访问者，在这里查看代码会很有帮助，因为您提供的链接可能并不总是它的稳定来源。

【参考方案1】：

如果您使用了 hoverIntent 插件并且收到错误“makeTall is not defined”，请检查您是否添加了该功能 例如在 hoverIntent 主页的源代码中，它看起来像：

<script type="text/javascript" charset="utf-8">
    $(document).ready(function()
        $("#demo1 li").hover(makeTall,makeShort);
        $("#demo2 li").hoverIntent(makeTall,makeShort);
        $("#demo3 li").hoverIntent(
            over: makeTall, 
            timeout: 500, 
            out: makeShort
        );
    ); // close document.ready

    function makeTall()  $(this).animate("height":75,200);
    function makeShort() $(this).animate("height":50,200);
</script>

但我在没有插件的情况下使用了另一种方式：

 <ul id="elem">
<li><a href="#"><span>1</span></a>
<ul id="child" style="display:none;">
   <li ><a href="">Home</a></li>
       <li ><a href="">About</a></li>
       <li ><a href="">Contacts</a></li>
       <li ><a href="">FAQ</a></li>
</ul>
 </ul>

 <script type="text/javascript">
$(function()
   $('#elem').mouseenter(function()
    $('#ch').css('display', 'block');
   );
   $('#elem').mouseleave(function()
    $('#ch').delay(800).fadeOut('slow');
   );
    );
 </script>

希望这会有所帮助:)

【参考方案2】：

jQueryElement.find('ul:first').stop(true,true).hide(100);
jQueryElement.find('ul:first').stop(true,true).slideUp(100);

这两行：您可以通过将 100 增加到更大的数字来将菜单速度调整为较慢。

【参考方案3】：

还要添加延迟，请参阅以下内容： Jquery - Delay mouseout event Fade out jQuery menu after delay

【讨论】：

刚刚添加了这个插件但是有一个错误 - makeTall is not defined 什么问题？

你添加了哪个插件？这只是在您加载后发生的吗？

jquery.hoverIntent.minified.js 是的，一旦我加载它就会发生。 livedemo04.prestatrend.com

你试过setTimeout吗？ mouseout: function() setTimeout(function() $c('hide!'); hideUnderConstruction(); , 500);

我从未使用过 hoverIntent 插件，所以对此我无能为力。

【参考方案4】：

查看 jQuery hoverIntent 插件：

http://cherne.net/brian/resources/jquery.hoverIntent.html

【讨论】：

刚刚添加了这个插件但是有一个错误 - makeTall is not defined 什么问题？

听起来您缺少一项必需的功能。如果您不需要“makeTall”函数，只需传递一个空函数定义即可。这可能会有所帮助：***.com/questions/2196429/…

【参考方案5】：

您可以查看 hoverIntent 插件，让您定义一些有助于鼠标输入/输出交互的变量：http://cherne.net/brian/resources/jquery.hoverIntent.html

【讨论】：

刚刚添加了这个插件但是有一个错误 - makeTall is not defined 什么问题？