Note: By default the position of all the elements in an HTML page is “static” which means they cannot be moved as we did in the example above, so to change the position during the animation you have to first set the position of the HTML element to a relative, fixed, or absolute.
jQuery animate() using Relative Values:
We can also use relative values in the animate method. For example height: ‘+=50px’, will increase the current height with 50px each time the animate method executes.
When you define multiple animate() methods, the jQuery queues them in the given order so the animation takes place one by one, this brings a cool effect in the animation. You can do a lot more things using this functionality.
For example, you define an animate() method where you are setting up the font size of a specific text to large and then in the second animate method() method you set the font size of that same text to small so when this animation takes place, it will bring a popup effect to the text you have highlighted using animate() method. Let’s see this example.
We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.Ok