As far as I understand, .delay () does not work with .addClass and .removeClass, how can you implement the similarity of such a structure:

$('.element_1').click(function(){ $(this).addClass('element_2').delay(1000).removeClass('element_2'); });

So that when you click a class, you add a class, and then delete it and when you click again on an element, the same thing happens. .toggleClass is not appropriate in this case.

The bottom line is that after the click, CSS animation takes place via @keyframes.

  • You need setTimeout() . - Ihor Tkachuk
  • Yes thank you! Understood. - Frontendman

1 answer 1

Understood, the following script turned out:

  $('.element_1').click(function(){ $(this).addClass('element_2'); //Добавяляем класс элемнету setTimeout(function(){ // Устанавливаем задержку $('.element_1').removeClass('element_2'); //Удаляем элемент }, 1000); //1000 - одна секунда });
  • No, this is not possible. If you have several elements with the class .element_1, then the class will disappear for everyone, not just where it was added. If a user clicks frequently, visual bugs will come out. - Pavel Mayorov
  • You need to save $(this) to a local variable: var $this = $(this) and then use it. - Pavel Mayorov
  • Can I have a little more detail? - Frontendman
  • But where is more detailed? - Pavel Mayorov
  • Example script, for example. I am trying to solve a similar problem, where it is necessary for other elements to delete / add, it does not work. For example, there is a div in which input and label are nested when a label is added to the input .focus class, when .focusout is removed. - Frontendman