I have this example:
When you click the button the red text slides out to left but the problem is that the text in yellow jumps to the new position when the animation finished. How the yellow text can be "animated" to go to the new position in real time while the red text is sliding out?
HTML:
<div id="1" style="float:left; color:blue">
<a>THIS IS NUMBER 1</a>
</div>
<div id="2" style="float:left; color:red">
<a>THIS IS NUMBER 2</a>
</div>
<div id="3" style="float:left; color:yellow">
<a>THIS IS NUMBER 3</a>
</div>
<br/>
<button id="btn">GO!</button>
JS:
$("#btn").click(function()
{
$("#2").hide("slide", { direction: "left" }, 700);
});