Как остановить ввод мыши, когда анимация работает и движется - PullRequest
0 голосов
/ 25 июня 2018

У меня на анимации бегает и движется анимация, вот код:

$(".still").mouseenter(function () {
    w1.goToAndPlay(0);
    $("#w1").delay(300);
    $("#w1").animate({left: '-200px'}, 1700, function() {
        $("#w1").delay(550);
        $("#w1").animate({left: '0px'}, 2500);
    });   
})

Есть только одна большая проблема, которую я не могу обойти: если я вытащу указатель и снова,Сама анимация сбрасывается (goToAndPlay), а функция анимации продолжает работать.Теперь то, чего я хотел добиться, это «заморозить» функцию мыши, пока все не будет сделано.

Это то, что я пытался, и кажется логичным, но это не работает:

$(".still").mouseenter(function () {
    w1.goToAndPlay(0);
    $("#w1").delay(300);
    $("#w1").animate({left: '-200px'}, 1700, function() {
        $("#w1").delay(550);
        $("#w1").animate({left: '0px'}, 2500, function() {
            $(this).attr("class","still");
        });
    });   
}).mouseleave(function () {
    $(this).attr("class","moving");
});

ИтакЯ подумал: «Если я изменю класс, когда анимация движется, или пользователь перемещает указатель из нее, то« .still »селектор mouseenter больше не будет работать», но это, очевидно, неправильно, потому что, очевидно, mouseenter работает дажекогда класс меняется.Что мне не хватает?Спасибо!

1 Ответ

0 голосов
/ 25 июня 2018

Вы можете создать глобальную переменную "isAnimated" (вне области действия ваших текущих функций) и установить для нее значение false.На mouseenter он будет установлен в «true».В последнем анимационном обратном вызове вы устанавливаете значение false.В вашей функции анимации вы проверите, имеет ли значение isAnimated значение false, иначе оно не запустится.

...