J’utilise l’effet slide
toggle de jQuery UI pour changer de div:
$("#link").click(function(){ $("#targetDiv").toggle("slide", {direction: "up"}, 1000); });
Slide est le seul effet qui a l’animation que je veux, essentiellement, la division qui descend du haut. Je ne veux pas toggleSlide
car cela ne fait que modifier la hauteur de l’élément.
Le seul problème avec slide
est qu’elle pousse immédiatement les frères et sœurs vers les positions finales : http://jsfiddle.net/XYDyy/2/
Alors, y a-t-il un moyen de faire en sorte que les éléments frères ajustent leur position à l’instar de la div animasortingce?
Tout avis sera le bienvenu.
Vous pouvez le tromper en faisant un slideUp()
/ slideDown()
sur le .ui-effects-wrapper
que jQuery ajoute autour de l’élément:
$("#link").click(function() { if ($("#div1").is(':visible')) { $("#div1").toggle("slide", {direction: "up"}, 1000); $("#div1").parent(".ui-effects-wrapper").slideUp(1000); } else { $("#div1").toggle("slide", {direction: "up"}, 1000); $("#div1").parent(".ui-effects-wrapper").hide().slideDown(1000); } });
Démo: http://jsfiddle.net/jtbowden/LARkS/
Sinon, vous pouvez append votre propre wrapper et faire le slideUp
dessus, avec la position de #div1
définie sur bottom: 0px
.