Looked at how the slideUp() method works. I saw that the method reduces the height of the element to zero, then sets the display:none property, and then for some reason the non-displayed object sets the previous height. Why set the previous height, which was before the application of the method?

For example, there is a bunch of methods:

 $('#red').slideUp().fadeIn();

div#red is a red square. I was EXPECTED to see that there would not be any visible f adeIn (2000) , since the height is zero at the red square.

Somehow strange work out the methods:

  1. The slideUp() method works. First, the red square is reduced in height to zero, then it is set to display:none and for some reason, the height is restored to what it was before using the slideUp() method .

  2. The fadeIn() method works. The red square gradually appears, having an initial height.

I thought that if the method worked, then all the changes he made remain. For example, the height remains zero. And the height for some reason becomes the same as before the application of the method.

  • the question is "what is anyone thinking about why they did it so strangely" - Dimon

1 answer 1

That's precisely because the next animation may not be related to resizing the element. For example, as you rightly noted, .fadeIn() , which changes only the opacity .