как отключить кнопку во время анимации скорости? - PullRequest
0 голосов
/ 28 мая 2018
 var slideContainer = ('#slider');  
 var width = 720;

 function slide () {  
   if ( parseInt( $slideContainer.css('marginLeft') ) >= -2160 ) {
       $slideContainer.animate({'margin-left': '-='+width},200);
   }
 }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 
</script>

<a class='button' onclick='slide()'></a>

я хочу отключить кнопку только во время анимации (скорость анимации = 200 миллисекунд)

Ответы [ 2 ]

0 голосов
/ 28 мая 2018

Мое решение включает добавление класса disabled для изменения правил CSS для него, а также предотвращения поведения по умолчанию с использованием метода JavaScript preventDefault().Также в конце анимации будет вызвана функция дополнительного параметра callback.В этом случае функция обратного вызова удалит disabled class.

var slideContainer = $('#slider');  
var width = 720;

function slide(event) {
  if(!slideContainer.hasClass('disabled')) {
    slideContainer.addClass('disabled');
    slideContainer.animate({'margin-left': '-='+width}, 200, function(){
      slideContainer.removeClass('disabled');
    });
  }
  else {
    event.preventDefault();
  }
}
.disabled {
 color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="slider" class='button' onclick='slide()'>Test</a>
0 голосов
/ 28 мая 2018

отключить перед анимацией и использовать animate() завершить обратный вызов для повторного включения

 function slide () {  
   if ( parseInt( $slideContainer.css('marginLeft') ) >= -2160 ) {
       $('.button').addClass('disabled')
       $slideContainer.animate({'margin-left': '-='+width},200, function(){
           $('.button').removeClass('disabled')
       });
   }
 }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...