The .animate() method

Published on: May 13, 2018

Welcome to tutorial number 10 of the Easy jQuery series, part of In today's tutorial, we're going to take a brief look at the .animate() method in jQuery. The animate method is a great way to visually show changes as t hey are  happening. The method takes four arguments, the properties, duration, easing, and a complete callback function. Only the properties is required, the others are optional. The arguments needed in this method are as follows:

$('selector').animate(properties, duration, easing, complete);

The properties argument should contain CSS properties and values. The duration is done in milliseconds or slow/fast, The easing is either a swing or linear, by default it's swing. You can get more information on the jQuery api docs website. And the callback function is just something to trigger after the the animation has completed. 

I hope you enjoyed this tutorial! Please feel free to ask questions below or just leave your basic comments. 

To fork the fiddle and follow along:

Remember to checkout the Resources section below for associated downloadable content, JSFiddle links, and other resources. Watch the video and follow along!