Discussion :

[developpeurajax]

Bonsoir,
je vais vous expliquer ce que j'ai programmé et ce que je souhaite programmer (là où j'ai besoin d'aide).
En fait je souhaite que lorsque je clique sur un un menu d'une page html la nouvelle page arrive en glissant de la droite de l'écran vers la gauche de l'écran.
J'ai donc commencé par mettre une div vide en position absolute sur ma page html.
Puis dans un fichier php j'ai mis dans une variable un chemin vers une image. J'ai fait un fichier javascript en ajax qui appelle ce fichier php et dans la fonction success d'ajax j'utilise ce chemin vers cette image en le mettant via la fonction jquery css en background de ma div. Je mets aussi avec la fonction jquery css ma div en width et height de 100%.
Ensuite je mets la div tout à droite de l'écran grâce à la propriété css right et je fais glisser cette div avec l'image en background avec la fonction jquery animate.(propriété css left à 0 d'ou le glissement).
Cependant j'ai seulement fait glisser une image (l'image que je met en background de la div).
Comment faire glisser de la droite de l'écran vers la gauche de l'écran toute une page html codée?

PS:Je ne souhaite pas utiliser de plugin.

Merci

[developpeur1932]

Bonjour,
j ai du me reinscrire sous un autre pseudo car j'avais perdu mes identifiants.
Voici mon code. Ma div a pour id galerie.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
app = {
        init: function() {
          /* Gestion du clic sur le menu */
          $("#premierLi").on("click",this.submit)
        },
        submit: function(e) {
		e.preventDefault()
		$.ajax({
			type: "POST",
			url: "fichier.php", 
			data: $(this).serialize(),
			dataType: "json",
			success: function(data) {
                                $('#galerie').css({backgroundImage:'url(../'+data.url+')',width:'100%',height:'100%'});
			   	var largeur = $('body').width();
			   	$('#galerie').css({left:largeur});
                                $( "#galerie" ).animate({left: '0px' }, 2000);
                        }
		})
	 }
}
 
$(function(){
	app.init()
})

Dans mon code je positionne une image en arrière plan d'une div et ensuite je deplace cette div donc l'image arrive de la droite de l'écran vers la gauche de l'écran, mais comment faire arriver de le droite de l'écran vers la gauche de l'écran une page html toute entière?

Merci