> For the complete documentation index, see [llms.txt](https://antonshevchuk.gitbook.io/jquery-for-beginners/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://antonshevchuk.gitbook.io/jquery-for-beginners/40_animation/progress.md). # Progress Let's get back to the `animate()` method, which can accept an extended set of options as arguments — `animate(properties, options)`. The first argument is the CSS properties we've already worked with, and the second is a set of options that give us a bunch of new capabilities (I'll list all available options — some of them we've already seen):
optionpurpose
durationanimation speed
easing"linear" or "swing" function, or any other
queueflag/parameter for the queue; I'll talk about it shortly
specialEasing

a hash where you can specify which easing function to use for changing specific properties:

$("img").animate({
  "height": "+=100px",
  "width": "+=100px"
}, {
  "specialEasing": {
    "height": "linear",
    "width": "swing"
  }
})
stepfunction that will be called on each animation step for each CSS property; I'll describe it in more detail shortly
completefunction that will be called after the animation ends
startfunction that will be called before the animation begins
progressfunction that will be called on each step, but only once per element, regardless of the number of CSS properties
donefunction that will be called after the animation completes successfully
failfunction that will be called after the animation fails
alwaysfunction that will be called after the animation ends, regardless of the outcome
{% hint style="info" %} Support for the last five functions was added in version 1.8. This [jQuery release was marked by](https://blog.jquery.com/2012/08/09/jquery-1-8-released/) a global refactoring of animation and migration to Deferred. Why do I keep drawing your attention to changes in such old versions of jQuery? Simply because nobody knows what you'll end up dealing with, so it's better to prepare for the worst. {% endhint %} When would this be useful? Well, if you need to track animation progress, this is exactly what you need — specifically, the `progress(animation, progress, remainingMs)` function: ```javascript // change the height and width of images $("img").animate({ "height": "+=100px", "width": "+=100px" }, { "start": () => console.log("start"), "progress": (animation, progress, time) => console.log("progress", progress), "done": () => console.log("done"), "fail": () => console.log("fail"), "always": () => console.log("always") }) ``` {% embed url="" %}