По второму клику анимация выполняется с середины скрипта
Здравствуйте!
Есть код
$('.map_but1').click(animateChel);
var chelPos = true;
function animateChel(){
$('.map_auto').animate({"opacity":"0"},100)
if(chelPos == true){
chelPos = false;
$(this).css({"background-image":"url(./img/map_but1.png)"})
$('.map_but2').css({"background-image":"url(./img/map_but2.png)"})
$('.map_chel').animate({"opacity":"1"},300);
function chel2(){
$('.map_chel2').animate({"opacity":"1"},300);
$('.map_chel2').animate({"right":"290px","top":"90px"},1000);
$('.map_chel2').animate({"right":"395px","top":"235px"},800);//2 клик начинается с этой анимации
}
function chel(){
$('.map_chel').animate({"left":"265px","bottom":"150px"},1000);
$('.map_chel').animate({"left":"312px","bottom":"215px"},800);//2 клик начинается с этой анимации
}
setTimeout(chel,600);
setTimeout(chel2,300);
}
return chelPos = true;
}
Вся анимация выпоняется только по первому клику,по каждому последующему выпоняется с середины скрипта.Не понимаю почему так. |
Ничего не понятно, давайте полный рабочий код, со всеми элементами, иначе на чем проверять?
Самому писать лень. |
И не мудрено, поскольку эти функции выполняются одновременно:
$('.map_chel2').animate({"right":"290px","top":"90px"},1000);
$('.map_chel2').animate({"right":"395px","top":"235px"},800);
Чтобы выполнить их по очереди:
$('.map_chel2').animate({"right":"290px","top":"90px"},1000,"linear", function() {
$('.map_chel2').animate({"right":"395px","top":"235px"},800);
});
|
| Часовой пояс GMT +3, время: 13:19. |