How to run two jQuery animations simultaneously?

yes there is!

$(function () {    $("#first").animate({       width: '200px'    }, { duration: 200, queue: false });    $("#second").animate({       width: '600px'    }, { duration: 200, queue: false });});

That would run simultaneously yes.what if you wanted to run two animations on the same element simultaneously ?

$(function () {    $('#first').animate({ width: '200px' }, 200);    $('#first').animate({ marginTop: '50px' }, 200);});

This ends up queuing the animations.to get to run them simultaneously you would use only one line.

$(function () {    $('#first').animate({ width: '200px', marginTop:'50px' }, 200);});

Is there any other way to run two different animation on the same element simultaneously ?

I believe I found the solution in the jQuery documentation:

Animates all paragraph to a left style of 50 and opacity of 1 (opaque, visible), completing the animation within 500 milliseconds. It also will do it outside the queue, meaning it will automatically start without waiting for its turn.

$( "p" ).animate({  left: "50px", opacity: 1}, { duration: 500, queue: false }); 

simply add: queue: false.