In this third lesson I learned how to use the ".animate" function. This allows you to make elements move anywhere on the page.
For this example, I made the red square move 400 pixels to the right when it is clicked.
$(function() {
$('#box').click(function() {
$(this).animate({
"left" : "300px"
} , 4000);
$(this).animate({
"width" : "50px"
} , 4000);
});
});
Refresh the page to do it again.
You can see all the code by viewing the source of this page (Ctrl-U in most browsers).