From the course: jQuery for Web Designers
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
Animate numeric properties - jQuery Tutorial
From the course: jQuery for Web Designers
Animate numeric properties
- [Voiceover] In this movie we're going to take a look at jQuery Animate, which can take almost any numeric property in your CSS, and animate it for you. So here we are with our toggle button, which I've changed to say "Move" instead, but currently its function is just where we left it before, where it slide-toggles all of these berry-flavored waters. So what we're going to do now is change it, so it animates arbitrary properties, not just the ones that come in those special, named functions. Switching back to the script, we'll start to make a little change here. I'm gonna break the animation function onto its own line, and I'm going to replace it with animate. This is what we use when we want to animate anything numeric. We'll pass in an object as its first argument. And now we get to choose what we want to animate. So just for the purpose of demonstration, I'm going to go with, say, the left margin. This is a way that you can move things around pretty easily. So what I'll do here is…
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.