Créer Gauche / Droite Effet De Transition
Je suis en train de créer une diapositive à l'effet de transition comme celui affiché dans la vidéo http://www.youtube.com/watch?v=SZTiJmclaRc.
Lorsque le bouton est cliqué, l'actuel div#1 sera coulissant vers la gauche et se cacher tandis qu'un autre div#2 sera coulissant à partir de la droite et de la déplacer vers l'emplacement de la précédente slided hors div.
Et lorsque le bouton de déclenchement de nouveau la div#2 sera glissement à droite alors que précédemment cacher div#1 sera coulissant de gauche.
J'ai essayé de modifier le code à http://jsfiddle.net/qSvDz/ comme ci-dessous mais je n'arrive pas à obtenir le résultat que je voulais.
Quelqu'un pourrait pls part de moi une réflexion sur la manière de le faire.
function toggleDivs() {
var $home = $("#home");
var $memberHome = $("#member-home");
var $slideOut, $slideIn;
//See which <divs> should be animated in/out.
if ($home.position().left < 0) {
$slideIn = $home;
$slideOut = $memberHome;
}
else {
$slideIn = $memberHome;
$slideOut = $home;
}
$slideOut.animate({
left: "-" + $slideOut.width() + "px"
}, function() {
$slideIn.animate({ left: "0px" });
});
}
$("button").bind("click", function() {
toggleDivs();
});
Merci
Feu
Vous devez vous connecter pour publier un commentaire.
Quelque chose comme cela?
http://jsfiddle.net/k_rma/VmSX4/
HTML:
JS/JQUERY:
CSS: