jQuery delay for menu

Question

Could someone explain how to make delay for dropdown when mouse is out from #categories_block_top .tree ul ? Sorry but I am newbie at jQuery. Here is the link - http://livedemo04.prestatrend.com/ and js-file fot the menu is treeManagementTop.js.

You should post some code in the question. Especially for future visitors, it's helpful to see the code here because the link you provided may not always be a stable source for it. — Purag, Feb 20 '12 at 18:30

score 1 · Answer 1 · answered Sep 03 '12 at 11:48

If you used hoverIntent plugin and you got an error "makeTall is not defined", check if you added that function e.g. in the source of hoverIntent homepage it looks like:

<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>

But I did it another way without plugin:

 <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>

Hope this will help :)

score 0 · Answer 2 · answered Feb 20 '12 at 18:32

0

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

These 2 lines: You can adjust the menu speed to be slower by increasing the 100 to a higher number.

answered Feb 20 '12 at 18:32

Michael

3,568
3
37
50

score 0 · Answer 3 · edited May 23 '17 at 12:03

0

Also to add a delay see these: Jquery - Delay mouseout event Fade out jQuery menu after delay

edited May 23 '17 at 12:03

Community

1
1

answered Feb 20 '12 at 18:35

Michael

3,568
3
37
50

Just added this plugin but there is an error - makeTall is not defined What the problem? – John Smith Feb 20 '12 at 19:14
Which plugin did you add? Did this just happening once you loaded it? – Michael Feb 20 '12 at 19:21
jquery.hoverIntent.minified.js yes, it happening once I loaded it. http://livedemo04.prestatrend.com/ – John Smith Feb 20 '12 at 19:26
have you tried the setTimeout? `mouseout: function() { setTimeout(function(){ $c('hide!'); hideUnderConstruction(); }, 500); }` – Michael Feb 20 '12 at 19:34
I have never user the hoverIntent plugin, so I can't help with that. – Michael Feb 20 '12 at 19:35
hmm looks like the best option might be .delay() See: http://api.jquery.com/delay/ – Michael Feb 20 '12 at 19:45
I also think so, but I am do not understanding why at this post http://stackoverflow.com/questions/1089246/jquery-how-to-tell-hover-to-wait this plugin is more best way! – John Smith Feb 20 '12 at 19:47

score 0 · Answer 4 · answered Feb 20 '12 at 18:35

0

Check out the jQuery hoverIntent plugin:

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

answered Feb 20 '12 at 18:35

Derek Hunziker

12,996
4
57
105

Just added this plugin but there is an error - makeTall is not defined What the problem? – John Smith Feb 20 '12 at 19:17
Sounds like you are missing one of the required functions. If you don't require the "makeTall" function, just pass it an empty function definition. This may help: http://stackoverflow.com/questions/2196429/plugging-in-jquery-hoverintent-for-sliding-panel – Derek Hunziker Feb 20 '12 at 20:22

score 0 · Answer 5 · answered Feb 20 '12 at 18:36

0

You might check out the hoverIntent plugin lets you define some vars that help with mouseenter/out interactions: http://cherne.net/brian/resources/jquery.hoverIntent.html

answered Feb 20 '12 at 18:36

Johan

35,120
54
178
293

Just added this plugin but there is an error - makeTall is not defined What the problem? – John Smith Feb 20 '12 at 19:14

jQuery delay for menu

5 Answers5