Jquery延迟function

嗨，我为一个简单的淡入淡出菜单编写了两个jquery函数，它基本上将屏幕分成两半，并允许您进入两个站点之一。 如何在这些function工作之前设置2秒的延迟？ 这是我的代码：

$('#retailNav').bind({ mouseenter: function() { $('#retailFull:not(:animated)').fadeIn('slow'); $('#residentialNav:not(:animated)').fadeOut('slow'); }, mouseleave: function() { $('#retailFull').fadeOut('slow'); $('#residentialNav').fadeIn('slow'); } }); $('#residentialNav').bind({ mouseenter: function() { $('#retailHalf:not(:animated)').fadeOut('slow'); $('#retailNav:not(:animated)').fadeOut('slow'); $('#residentialFull p').html('Click to enter residential'); }, mouseleave: function() { $('#retailHalf').fadeIn('slow'); $('#retailNav').fadeIn('slow'); $('#residentialFull p').html('Residential'); } }); 

我是否以某种方式将这些包装在另一个function中？

Answer 1

您可以在fade*调用之前使用delay()函数，或者只将所有内容包装到setTimeout JS计时器中。

Answer 2

你可以逃脱：

 function thisFunction() { $('#retailNav').bind({ mouseenter: function() { $('#retailFull:not(:animated)').fadeIn('slow'); $('#residentialNav:not(:animated)').fadeOut('slow'); }, mouseleave: function() { $('#retailFull').fadeOut('slow'); $('#residentialNav').fadeIn('slow'); } }); $('#residentialNav').bind({ mouseenter: function() { $('#retailHalf:not(:animated)').fadeOut('slow'); $('#retailNav:not(:animated)').fadeOut('slow'); $('#residentialFull p').html('Click to enter residential'); }, mouseleave: function() { $('#retailHalf').fadeIn('slow'); $('#retailNav').fadeIn('slow'); $('#residentialFull p').html('Residential'); } }); } setTimeout(thisFunction(), 2000);