Подождите, пока анимация наведения закончится до выполнения других

Question

Надеюсь, это не повторяющийся вопрос, я не могу найти ответ. Вот моя проблема:

У меня есть анимация hover, сделанная в jQuery, что бы мне хотелось, если пользователь наведет еще одну ссылку, я хочу, чтобы первая анимация выполняла обратный вызов и снова анимировала.

Вот пример того, что у меня до сих пор: http://sebastien-crapoulet.fr/test/

Если у вас есть ссылка «A» PROPOS, вы получите полную анимацию, теперь то, что я хочу, если вы идете от «A предлагать «в портфолио», для того, чтобы выполнить обратный вызов предложения A, чем выполнить другую анимацию зависания.

Я пошарил с помощью .stop() и .filter (': not (: animated)'), безуспешно.

Вот что у меня до сих пор:

$('nav ul li a').hover(function(){ 
    link    = $(this) 
    color    = $(this).data("color") 
    position   = link.position(); 
    background   = $('.menuBackground') 

    if (color=="blue"){ 
     background.css({ 
      'background-color':'#99b3c4', 
      'width':(position.left)+(link.width())+20+'px', 
      'top':position.top+'px' 
     }) 
     background.stop().animate({ 
      left:'0%' 
     },500) 
    } 
    if (color=="green"){ 
     background.css({ 
      'background-color':'#91b6a5', 
      'width':(position.left)+(link.width())+20+'px', 
      'top':position.top+'px' 
     }) 
     background.stop().animate({ 
      left:'0%' 
     },500) 
    } 
    else { 
     return false; 
    } 
},function(){ 
    background.stop().animate({ 
     left:'-100%' 
    },500) 
    return false; 
}) 

Заранее спасибо за любую помощь вы могли бы дать!

Answer 1

Когда пользователь наводится на первый элемент, анимируйте второй элемент, закрывающий И первый элемент, открывающий и наоборот.