Discussion :

[kenji33]

bonjour

j'ai un souci avec jQueryMobile.

je dois pouvoir en faisant un swipe gauche ou droite passer sur l'article suivant ou précédent.

Le code ci dessus fonctionne bien mais au bout d'un moment cela devient fou.

Je suis sur "article A", je swipe a droite et j'ai "article B", je swipe a gauche je reviens sur "A", ensuite je swipe à nouveau a droite et la je pars sur "C"
et une fois sur "C" si je swipe à nouveau c'est le carousel qui s’enchaîne

je passe de la page C à A, ensuite je reviens sur B qui revient sur C etc...
et au bout d'une dizaine de changement, cela s’arrête sur une page et plus je swipe plus cela fait un effet totalement fou de défilement à l'écran

le next et prev sont des urls

j'ai mis url 192.x.x.x.x pour pouvoir y accéder en local depuis iphone/ipad en debug dans l'exemple ci dessous

dans le html

Code :

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

div data-role="page" data-dom-cache="false" class="actus-page" id="news" data-theme="a" data-next="http://192.168.5.100/Encours/test-mobile/www/n/40702" data-prev="http://192.168.5.100/Encours/test-mobile/www/n/40698" data-title="ceci est un test">

et dans le js

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
$( document ).on( "pageinit", "[data-role='page'].actus-page", function() {
		var page = "#" + $( this ).attr( "id" ),
	        next = $( this ).jqmData( "next" ),
	        prev = $( this ).jqmData( "prev" );
 
	    if ( next ) {
	        $( document ).on( "swipeleft", function() {
	        	$.mobile.changePage( next  , {transition: "slide"});
	        });
	    }
	    if ( prev ) {
	        $( document ).on( "swiperight", function() {
	            $.mobile.changePage( prev, { transition: "slide" , reverse: true } );
	        });
	    }
	});

lorsqu'on swipe à droite, puis a gauche, au bout d'un moment cela part dans tous les sens et ne respecte plus rien

merci de votre aide

[kenji33]

voici le code qui à résolu le problème

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
$( document ).on( "pageinit", ".actus-page", function() {
	var 
		$page = $(this),
		page = "#" + $page.attr( "id" ), 
		next = $page.jqmData( "next" ), 
		prev = $page.jqmData( "prev" ); 
 
	if ( next ) {  
		$page.on( "swipeleft", function() { 
			$.mobile.changePage( next , {transition: "slide"}); 
		}); 
	} 
 
	if ( prev ) { 
		$page.on( "swiperight", function() { 
			$.mobile.changePage( prev, { transition: "slide" , reverse: true } ); 
		}); 
	} 
});