From the course: jQuery: UI Widgets
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
Animated behaviors - jQuery Tutorial
From the course: jQuery: UI Widgets
Animated behaviors
jQuery UI extends the built-in animation capabilities of jQuery Core, pretty extensively. We're going to look at some of the ways that it does that in this movie. So here I have an image and a little box with a colour. The first thing that we'll look at is some built in effects,. The jQuery UI effects library takes some of the existing capabilities and packages them up in ways that are convenient to call in your code. So for example, there's a puff effect. Make the flowers go puff, and they disappear. It's basically just scaling, and fading them out, but it does it all at once, in one named function. Let's see what that looks like. going to jump down to the bottom of this file, scroll up a little bit, and here it is. I'm triggering this first on the click of this button, and then. I'm just calling the effect method on the selected image. The effect is called puff. I just call it by name with that string. And then I give it a duration, which is 300 milliseconds, in this case. So, it's…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.