Показать сообщение отдельно
  #1 (permalink)  
Старый 24.06.2019, 17:01
Аспирант
Отправить личное сообщение для Aleksanderj Посмотреть профиль Найти все сообщения от Aleksanderj
 
Регистрация: 14.06.2013
Сообщений: 70

Как выполить второй клик?
Здравствуйте.
Использую две анимации anima.js по клику на одну кнопку:
var buttonEl = document.querySelector('.burger');

// First Click button
function clickButton() {
  anime.remove(buttonEl);

var clickAnimation = anime.timeline ({
	targets:'.closeLine1, .closeLine2 ', 	
    delay: function(el, i) { return i * 75; }, 
    duration: 150,
  	easing: 'linear'
  });
  clickAnimation.add({
    targets:'.not-clickable .burgerLine1, .not-clickable .burgerLine2', 
    width:  '0px',
	update: function(anim) {		
      buttonEl.classList.remove("not-clickable");
      buttonEl.classList.add("clickable");
    }    
  });  
   clickAnimation.add({	 
    width: ['0px', '32px']
  });
   
}
buttonEl.addEventListener('click', clickButton,  function() {	
	anime.clickButton;	
});

// Second Click button
function unClickButton() {
  anime.remove(buttonEl);

var unClickAnimation = anime.timeline ({
	targets:'.clickable .closeLine1, .clickable .closeLine2 ', 	
    delay: function(el, i) { return i * 75; }, 
    duration: 150,
  	easing: 'linear'
  });
  unClickAnimation.add({    
    width:  '0px',
	update: function(anim) {	
		buttonEl.classList.remove("clickable");
      buttonEl.classList.add("not-clickable");      
    }    
  });
  unClickAnimation.add({
    targets:'.burgerLine2', 
    width:  ['0px', '24px']    
  });  
   unClickAnimation.add({	
	targets:'.burgerLine1',
    width: ['0px', '32px']
  });   
}
buttonEl.addEventListener('click', unClickButton,  function() {		
		anime.unClickButton;		
});

Подскажите как сделать так, чтобы функции выполнялись поочередно по клику на кнопку(при первом нажатии одна, при втором другая)?
Ответить с цитированием