11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour toujours sur mon problème de liseuse HTML5.
J'avance j'ai bien maintenant l'effet paper-like et le zoom compatible tous navigateurs dernières générations.
Mais il me reste à implémenter une fonctionnalité lors du zoom : la possibilité de scroller avec le mouvement de la souris avec ça j'aurais une liseuse comme celle de issuu mais sans flash !!!
J'ai bien compris qu'il me fallait un "mouse-trap" un carré qui entoure la souris afin de maintenir le scroll donc ça c'est bon pas de difficulté, néanmoins j’avoue que je me retrouve bloqué après cette étape.
Si quelqu'un a des pistes ou des idées je prends !

Donc je reprends pour être bien clair :
Je cherche à supprimer les barres de scroll horizontale et verticale lors d'un zoom(overflow: hidden;) et à les remplacer par un scroll vertical lorsque la souris se déplace verticalement et un scroll horizontal lorsque elle se déplace horizontalement.
Tu passe event à ta fonction mousemove et dans cet event, tu as clientX et clientY qui te donnent la position de la souris, si la différence X est supérieure à la différence Y, c'est qu'on scroll horizontalement, et inversement. Enfin, avec la fonction scrollTo, tu peux modifier la position de scroll X et Y d'un div. Normalement là, t'as tout.
Je suis déçu car avec cette méthode il faut taper le bord de l'écran pour que la page se décide à scroller. Et je voudrais que la page suive vraiment les mouvements de ma souris. Smiley sweatdrop
Tu peux expliquer ton principe de mouse-trap?
Est-ce que tu comptes utiliser ton scroll uniquement à la souris, ou sur terminaux à écrans tactiles également?

Pour répondre précisément à ton besoin, l'algo de base est très simple:

mousedown -> j'enregistre la position x,y du curseur
mousemove -> le curseur a bougé, je récupère sa nouvelle position x,y et la différence par rapport à la position précédente, et ça me donne le décalage à appliquer au contenu.
mouseup -> j'arrête de déplacer le contenu Smiley cligne