JQuery Отключить следующую кнопку до завершения анимации

Question

Это круто, и я знаком с этим. Однако я хочу, чтобы следующие и предыдущие кнопки оставались видимыми, просто не удавалось. В моей конкретной ситуации кнопки являются изображениями, которые являются частью дизайна. Я просто хочу, чтобы пользователь не сможет нажать перед концами анимации.

Answer 1

$(function(){
    $("#previous").bind("click", Previous);
    $("#next").bind("click", Next);
});

function DoAnimation() {
    $("#previous,#next").unbind("click");
    $('#id').animate(
        complete: function() {
            $(this).after('<div>Animation complete.</div>');
            $("#previous").bind("click", Previous);
            $("#next").bind("click", Next);
        }
    });
}

function Previous() { }
function Next() { }

Answer 2

Еще одна техника:

$(".next,.prev").click(function(){
    if ($('#my_animated_elelement').is(':animated'))
    {
        return false;
    }
})

Answer 3

Я думаю, у вас есть JavaScript требует изображений onClick's, используйте переменную MyApp.IgnoreNextPrevClicks Флаг флаг, выполняют ли обработчики onClick выполнять или нет.

MyApp={}
MyApp.IgnoreNextPrevClicks=false;
MyApp.PrevClick=function() {
    if(MyApp.IgnoreNextPrevClicks) return;
    //real work goes here
}

Теперь, прежде чем позвонить аниматору jQuery, установить MyApp.IgnoreNextPrevClicks to true, и установите его обратно в false после завершения анимации (используйте обратный вызов jQuery Animation).

Answer 4

function btn() {
   $('#btn').one('click', function(){
     //call your animation function here.

     setTimeout(btn, animation duration);
  });
}

Answer 5

$('#mybtn').attr("disabled","disabled"); // to Disable Button

$('#mybtn').removeAttr("disabled"); // to Enable Disabled button