Click to toggle dark text on white

Lession 1: jQuery animations are simultaneous with one another

A Education in jQuery Animation

As you can see, jQuery animations, by default, are simultaneous to each other.

Show Code

$(document).ready(function() {
    $("#clickhere").click(function() {
        $("#animate1").animate({
            height: "20px",
            width: "10px",
        }, 1000);
        $("#animate2").animate({
            height: "50px",
            width: "500px"
        }, 1000);
    });
});

Just as a reminder, jQuery.animate function calls take this form: jQuery(selector).animate( properties, [ duration ], [ easing ], [ callback ] ) With properties in [ brackets ] being optional.

The type of jQuery animation in this example is very smooth, because the elements being animated are very simple. Be careful when animating complex elements containing many other elements, because there is potential for the quality to degrade.

What you can animate with jQuery >>

Wayfarer

Most Recent Blog Post: jQuery Mapbox Updated

Privacy Policy | Click Here | jQuery Plugins by Wayfarer | Freelance Jobs Available | Random JavaScript Code Samples | Share a Random Link | JavaScript Jobs