Discussion :

[Trente]

Bonjour,

je suis peu expérimenté mais comme mon site utilise quelques routines java je me demandais si c'était possible de compléter l'avance ou le recul des pages de mon site par glissement du doigt sur un téléphone Androïd , sur un PC ce sont les flèches droite <=> gauche qui permettent l'avance ou le recul.
La séquence actuelle est :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 function handler(e) {
     if (document.all) e = window.event;
     var key;
     var msg = '';
     key = e.keyCode;
     if (document.layers) key = e.which;
     if (document.all)    key = e.keyCode;
     if (key==39) msg = '_00001.htm';
     if (key==76) msg = '_00016.htm';
     if (key==80||key==37) msg = '_00015.htm';
     if (msg!='') location = msg;
   }

pour key=39 flèche gauche c'est un recul et pour key=76 flèche droite du PC c'est une avance.

Si vous avez la solution à me proposer, je vous en remercie d'avance.

Très bonne journée à vous.

[gabi7756]

Bonjour,

compléter l'avance ou le recul des pages de mon site par glissement du doigt sur un téléphone Androïd

Rien compris ...

Il va falloir un peu plus de code pour comprendre comment c'est fait de base?


Dans l'idée il faut addEventListener(touch) sur chaque image ou contenaire qui l'affiche.

Sauvegarder la position

Et lors du https://developer.mozilla.org/en-US/...ouchmove_event Calculer combien il y a d'écart avec le point d'origine, on va dire, quand 30% de la largeur de l'écran est parcouru on peux skiper et passé soit à la photo suivant, soit précédente.

Si soustraction donne un - , alors c'est la photo d'avant

Sinon après



Pour information, ne pas oublié de gérer les cas de zoom, et en cas de zoom detecter si on est au bord de l'image ou pas.

Voir peut être rajouté une petite icone sur le côté comme lorsque l'on reload une page WEB.

[NoSmoking]

Bonjour et bienvenue sur DVP.
Tout d'abord :

Code :

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

1
2
     if (document.layers) key = e.which;
     if (document.all)    key = e.keyCode;

Ce script date du siècle dernier à l'époque de IE vs NetScape, il faut passer à la suite ...

par glissement du doigt

c'est exactement ce qui se passe lors d'un Drag&Drop donc il te faut envisager cela comme tel en y joignant une gestion des touches « plus moderne ».

La gestion via pointerdown me paraît la plus pertinente.

Ressources :

Les événements de pointeur
Exemple de mise en oeuvre du glisser sur pC et mobile : Carousel infini et « responsive », voir la Class Carousel

[Trente]

Merci pour votre réponse, je vais essayer d'avancer. En fait j'espérais un code retour immédiat dés qu'on passe le doigt sur l'écran du GSM comme pour la flèche droite ou gauche avec le PC... je rêvais!

Je vais quand même chercher avec les informations que vous m'avez données et l'aide de mon petit-fils.

bonne soirée

[NoSmoking]

D'après ce que j'ai compris tu souhaites lors d'un glissé du doigt sur ta page « avancer/reculer dans ta liste ».
Les choses simples ne se résumes malheureusement pas la plupart du temps à du code simple et compact.

Dans ton cas il me semble que le plus simple, et accessoirement le plus ergonomique, serait de faire apparaître à gauche et à droite de ta page des flèches de direction qu'il suffirait de cliquer, comme sur des slides.
Là pour le coup le codage est simple

[Trente]

Bonjour,

oui je m'étais mal expliqué, c'est bien ça que je veux: avancer (avec le doigt) dans ma liste qui sert à afficher une image avec mise en forme, fond d'écran, un menu et un petit texte. Effectivement je vais essayer de trouver la solution des flèches droites et gauche à placer de chaque côté de la photo.

Merci pour ce bon conseil