CODEWITHSUNDEEP
jqueryanimation
harpo
harpo

Reputation: 43168

Passing dynamic CSS to jQuery.animate

The documentation of jQuery.animate states that

The only required parameter is a map of CSS properties. This map is similar to the one that can be sent to the .css() method, except that the range of properties is more restrictive.

So, why does this work

$('#con div').css( {
        top : function(i) {
            console.log(i);
            return (i * 500) + 'px';
        }
    }
);

and this doesn't?

$('#con div').animate( {
        top : function(i) {
            console.log(i);
            return (i * 500) + 'px';
        }
    }
);

The console shows that the function is being evaluated for css, but not for animate. Am I missing something?

By the way, I'm using 1.4.2.

Upvotes: 2

Views: 412

Answers (1)

Will Vousden
Will Vousden

Reputation: 33358

This may not be what you're after, but a simple solution would be simply to iterate over the elements and apply the animations individually:

$('#con div').each(function(i)
{
    $(this).animate({ top: i * 500 });
});

This is essentially what your snippet amounts to, after all.

Upvotes: 2

Related Questions