我正在使用 jQuery (3级)制作动画菜单。我正在使用效果slideDown
和slideUp
。有时(但并非总是),当我打开第一个主要项目的子菜单时,第二个主要项目的子菜单将无法工作,直到我刷新页面。它可以使用效果fadeIn
和fadeOut
,但我想使用幻灯片。
这是我的代码:http://jsfiddle.net/mcCAx/
答案 0 :(得分:0)
这为我修复Here
$(document).ready(function()
{
$('li.MainStage').hover( function()
{
$(this).stop();
$(this).find('ul.SubStage').slideDown('slow');
}, function()
{
$(this).stop();
$(this).find('ul.SubStage').slideUp('slow');
});
$('li.SubStage').hover( function()
{
$(this).stop();
$(this).find('ul.Sub2Stage').slideDown('slow');
}, function()
{
$(this).stop();
$(this).find('ul.Sub2Stage').slideUp('slow');
});
});
答案 1 :(得分:0)
问题是您的<ul class="SubStage">
元素的样式被覆盖了。因此,通过在回调中重新覆盖样式来与火战斗。您的旁边菜单每次都会显示。 :)
$(document).ready(function()
{
$('li.MainStage').hover(
function()
{
$(this).find('ul.SubStage').slideDown('slow',function(){
$(this).parent().find('ul.SubStage').css({overflow:"visible"});
});
},
function()
{
$(this).find('ul.SubStage').stop().slideUp('slow');
});
$('li.SubStage').hover(
function()
{
$(this).find('ul.Sub2Stage').slideDown('slow');
},
function()
{
$(this).find('ul.Sub2Stage').stop().slideUp('slow');
});
});