2012-03-16 2 views
2

Я пытаюсь скрыть скрытие пролета, в то время как другие проецируют fadein поверх него, но задержка и установка не кажутся работающими, при выводе страницы мигает белая перед другой 3 изображения исчезают сверху. Задержка заключается в функции мыши. Вот fiddleЗадержка jquery и setTimeout

$("#top-left").mouseover(function() { 
     $("#bottom-left").fadeOut(200); 
     $("#bottom-right").fadeOut(200); 
     $("#top-right").fadeOut(200); 
     $(this).css("width","+=400"); 
     $(this).css("height","+=250"); 
     $(this).css("z-index", "-1"); 
    }); 
    $("#top-left").mouseout(function() { 
     $("#bottom-left").fadeIn(200); 
     $("#bottom-right").fadeIn(200); 
     $("#top-right").fadeIn(200).delay(10000); 
     setTimeout(function() { 
       $(this).css("width","-=400"); 
       $(this).css("height","-=250"); 
       $(this).css("z-index", "1"); 
     },400); 
    }); 

Спасибо.

ответ

2

Огонь последняя часть в качестве обратного вызова на анимации:

$("#top-right").fadeIn(200, function() { 
    $("#top-left").css("width","-=400").css("height","-=250").css("z-index", "1"); 
}); 

, что так оно не будет выполняться, пока анимация не будет сделано.

+1

+1 Ударьте меня! Функции обратного вызова - это способ группировки событий JS. 'settimeout()' также не всегда является надежным. – msanford

+0

Полностью не думал о обратном вызове, я попробую. – rd42

Смежные вопросы