Div's aparecendo e correndo

[Carcleo 4]

Olá pessoal, tenho a seguinte estrutura de div's

<div id="box">

  <div id="1">1</div>

  <div id="2">2</div>

  <div id="3">3</div>

</div>

E o seguinte css:

#box {

 width: 1000px;

 height: 300px;

}

#1, #2, #3 {

 width: 333px;

 height: 300px;

 float: left

}

#1 {

  margin-left: 0px;

}

#2 {

  margin-left: 333px;

}

#3 {

  margin-left: 666px;

}

Gostaria de fazer com que as 3 DIV's 1, 2 e 3, ao carregar na página, apareçam desde o canto direito da tela até a sua posição correta.

Tipo:aparece a div 1 colada no canto direito e ela vai correndo lentamente para a esquerda até chegar a sua posição de margin-left: 0px;

Em seguindo aparece a div 2 e faz o mesmo até chegar a margin-left: 333px e analogamente a div 3 até margin-left: 666px.

Como fazer isso?

[wootzor 103]

Podes tentar adaptar estes exemplos às tuas necessidades.