Написал кое-как меню:
$('.menuholder').hover(function()
{$('.back')
.animate({"height":"500px"},'1000');
//.css("height","500px");
}, function () {
$('.back')
.animate({"height":"0px"},'100')
;});
$('.menu li').hover(function(){
$('div.subs div.dl').stop().delay(1000).animate({"marginLeft":"10px"},'2500');
$('div.back')/*.delay(100)*/
.animate({"height":"500px"},'1000')
//.css('height','500px')
;
}, function(){
$('div.subs div.dl').css('marginLeft','-1000px');$('div.back')
.animate({"height":"0px"},'100')
;});
});
Само меню отрисовывается так:
<?php if ($categories) {?>
<div class="menuholder">
<ul class="menu slide">
<?php foreach ($categories as $category) { ?>
<li><a href="<?php echo $category['href']; ?>" class="orange"><h2><?php echo $category['name']; ?></h2></a>
<?php if ($category['children']) { ?>
<?php for ($i = 0; $i < count($category['children']);) { ?>
<div class="subs">
<div class="dl">
<?php for ($i = 0; $i < count($category['children']); $i++) { ?>
<?php if (isset($category['children'][$i])) { ?>
<div class="item">
<div><a href="<?php echo $category['children'][$i]['href']; ?>"><img alt="<?php echo $category['children'][$i]['name']; ?>" src="<?php echo $category['children'][$i]['image']?>"></a></div>
<div class="link"><a href="<?php echo $category['children'][$i]['href']; ?>"><?php echo $category['children'][$i]['name']; ?></a></div>
</div>
<?php } ?>
<?php } ?>
</div>
</div>
<?php } ?>
<?php } ?>
<?php } ?>
</li>
</ul>
<div class="back"></div>
</div>
так вот вопрос таков - как реализовать то, чтобы при наведении на пункт меню, оно появлялось с задержкой. То есть при случайном наведении оно не выскакивало, а требовало наведенного курсора примерно одну секунду?