jQuery facilité animation

Question

J'ai mes codes comme

<div id="container"> 
    <div id="one"></div> 
    <div id="two"></div> 
    <div id="three"></div> 
    <div id="four"></div> 
</div> 

Chaque div a une largeur de 250px & flottent à gauche; Lorsque je clique sur un bouton, j'utilise hide ('one'); Lorsque la div # 1 disparaît, les trois autres div prennent leur place vide et cela arrive tout à coup. Ce que je veux, c'est que quand le div # 1 disparaît, je veux que les 3 divs restantes glissent lentement vers la gauche .. d'une manière plus facile. Comment devrais-je faire ça?

Answer 1

Si vous donner une durée à .hide() vous êtes tous ensemble, ce sera une animation, comme ceci:

$("#one").hide("slow"); 

You can test it here.
_{Note: Cela fonctionne avec ou sans jQuery UI, il fait partie de jQuery de base}

Answer 2

Une façon est de réduire cette div ... mais si vous voulez un fadeOut puis un psy, vous pouvez d'abord utiliser Animate () pour changer l'opacité à 0, puis rétrécir ce div, en utilisant aussi animate(). Vous pouvez utiliser un rappel avec la première animation() ou mettre en file d'attente les deux animations ensemble.

On dirait que la réponse de Nick à hide() va s'estomper et se rétrécir en même temps, ce qui pourrait être tout ce dont vous avez besoin.