0

I have an event when user clicks on keyDown on keyboard and it works but I want when the click happens for the second time to do something different. It works also, but if user click on keyboard twice quickly it will make my animation not look good. I want the second event not occur until first is finished. What should I do?

I need something make the same event uncallable until the first is done.

window.addEventListener("keydown", (e) => {

    (e.key === "ArrowDown") ? slideDown() : null;
    (e.key === "ArrowUp") ? slideUp() : null;
    (counter === 3) ? myName.style.color = "white" : myName.style.color = "black";

})
Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
  • Maybe using a variable to store the status? – flyingfox Oct 22 '22 at 11:56
  • explain more please – Abdel Rahman Yosry Oct 22 '22 at 11:57
  • You need [debouncer](https://stackoverflow.com/a/4298672/1169519). – Teemu Oct 22 '22 at 12:02
  • Does this answer your question? [What is the "debounce" function in JavaScript?](https://stackoverflow.com/questions/24004791/what-is-the-debounce-function-in-javascript) – pilchard Oct 22 '22 at 12:04
  • What does your `slideDown` function return? What does it provide to know whether it was finished? – trincot Oct 22 '22 at 12:09
  • its will add class to some element in my html to make animation start, its work but i want event doesn't happen until animation happen – Abdel Rahman Yosry Oct 22 '22 at 12:11
  • Please edit your question and add the HTML and CSS class information. There are several ways animations can be triggered, and the solution is different for each of them. – trincot Oct 22 '22 at 12:24
  • i fix my problem thank god :) i use timeIntervel and setTimeout(); and it work with me to do what i want – Abdel Rahman Yosry Oct 22 '22 at 13:01
  • 1
    No, using a timer for this is a horrible solution! Each event already has a timestamp you could use. Yet, the underlying problem is with how you are doing the animation and not with the multiple keydown events. Please edit your question per @trincot comment. – Yogi Oct 22 '22 at 13:51

0 Answers0