There is a block and a hidden paragraph. When you click on a block, a paragraph appears animatedly. The display animation has a stop method with values ​​of 0.0 (false, false). But there are also conditional statements: if which is not executed for the first time. There is also a stop in his body, but with values ​​of 1.1 (true, true). Question: why even if if not executed stop behaves as if it has a value of 1.1?

$(document).ready(function(){ $('.q1').click(function(){ if($(this).next().is(':visible')) // Это не выполняется т.к. Абзац ещё не виден $(this).next().stop(true,true).slideUp(); // Это не выполняется т.к. Абзац ещё не виден $(this).next().stop(0,0).slideToggle();//Так почему у stop ведёт себя будто у него значение true,true ? }); }); 
 *{ margin:0; padding:0; } .q1{ width:50px; height:50px; background: red; } p{ width:150px; height:300px; background: black; display:none; } 
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> <div class="q1"></div> <p></p>

  • Question: why even if if not executed stop behaves as if it has a value of 1.1? So why does stop behave as if its value is false false? Why do you have two different questions? which you need to answer here? - Oleksandr
  • @ Oleksandr Typo. Corrected. - PeGaS
  • No explanation? - PeGaS
  • I can not understand what behavior you expect. stop behaves in the same way when no animation happens - Crantisz
  • @Crantisz If you quickly click on a block 2 times, then the animation will occur in the settings of stop (true, true). - PeGaS

1 answer 1

Let's see what happens when you press 2 times in a row on a button.

1 click

.is(':visible')) Here we have false skip .stop(true,true).slideUp();

.stop(0,0).slideToggle(); A paragraph begins to appear. It's all clear.

2 press

.is(':visible')) Here we have true . Although the paragraph has not yet appeared, but it is already visible !

.stop(true,true).slideUp(); Jump to the end of the animation. And we begin to hide the block.

.stop(0,0).slideToggle(); Stop the animation at the very beginning and start hiding the block.

  • And if you add $ (this) .next (). Stop (0,0); before the if statement, jsfiddle.net/c4moLg2a is overridden and when double-clicked, it works with the values ​​(0, 0) - PeGaS
  • @PeGaS then it is not clear why all this is necessary, when you can get by with one line jsfiddle.net/c4moLg2a/1 - Crantisz
  • The last nuance. Just why stop works as 0.0 if double-clicking when the value occurs in if and stop has 1.1 specified there? jsfiddle.net/cpdg5kza - PeGaS
  • Or stop in the if body does not work because there is no queue due to the previously activated span from 0.0 - PeGaS