JeuWeb - Crée ton jeu par navigateur

Version complète : [JS] Positionner la windows où l'on veux avec des scrolls désactivées?
Vous consultez actuellement la version basse qualité d’un document. Voir la version complète avec le bon formatage.
Pages : 1 2
Bonsoir,

j'aurais bien besoin d'un coup de pouce pour trouver un truc que je n'arrive pas a faire. Pour faire très concret, ouvrez la page suivante: http://rpgmaker.net/media/content/games/.../Kaire.png , puis ouvrez firebug et ajouter un "overflow:hidden" sur le body.

A cause de cette contrainte, le scrollTo() ne marche pas. Comment faire pour voir le bas de l'image qui ne rentre pas dans l'écran à la base (si vous avez un trop gros écran, prenez une image plus grande que celui-ci)?

Le but est d'améliorer les performances en ne touchant pas au positionnement de l'image elle même, j'aimerais juste déplacer la vu qu'on a du navigateur vers les coordonnées X, Y de mon choix.

Firefox permet de zoomer/désomer en cliquant sur l'image, ce qui ma permis de voir que dans l'objet window, il semble que les propriété window.pageXOffset et pageYOffset jouent un role (enfin je pense).

Le problème c'est que window.pageXOffset = X ou window.pageXOffset.value = X ne marche pas (vous pouvez tester avec la console firebug)...

Bref, je ne sais donc pas comment faire pour placer l'écran aux coordonnées où je veux avec des scroll désactiver (overflow:hidden) sur une image plus grande que l'écran, quelqu'un à une idée/solution?!


merci.
marche pas le lien
Il suffit d'enlever la virgule parasite à la fin du lien.

heuu je suis pas certain d'avoir saisi ton problème en tout cas, mais pourquoi ne pas partir sur une Lightbox tu aurais ainsi la liberté que tu veux pour ton traitement non?
Pourquoi ne veux-tu pas déplacer l'image? C'est je pense la seule solution vraiment valable et fiable, car dans les specs des différents langages, c'est plutôt l'écran qui est fixe et le contenu de l'écran qui bouge, que le contraire... Quand on a un scroll, c'est le contenu qui scroll, et non l'écran qui se ballade au-dessus du contenu scrollé.

Donc, sans scroll, je pense que ce n'est pas possible. Ensuite, si tu ne veux pas déplacer l'image au sens "top/right/bottom/left" constants, rabats-toi sur les margin/padding, ou imbrique deux éléments: une "div" (ou autre display) qui sera la "fenêtre d'affichage", fixe, et une image dedans, qui se ballade librement.
saleté de virgule, je me fais avoir a chaque fois^^

Sinon le problème est que le déplacement de la map en temps réel cause des lags car y a d'autres traitement en même temps, du coup déplacer une grosse image c'est recalculé la position de chaque pixel c'est pour ça que c'est lent, alors que déplacer l'endroit où on voit c'est plus rapide.

D'ailleurs, si vous désoomer en cliquant sur l'image et que vous reclicker pour zoomer, cela va zoomer là où vous avez clické, ça montre bien que c'est possible, même sans scroll !
Alors, dans ce cas, je peux te proposer une méthode très moche, mais potentiellement efficace: les hash.
Un élément HTML avec un identifiant est à placer dans le même conteneur que l'image. Cet élément doit être non-visible (display none? ou opacity 0...) et posséder un identifiant, @id=truc.
Cet élément est alors à positionner au point où tu veux le focus (je ne sais pas si le focus sera centré sur l'élément, ou si l'élément sera aligné en haut à gauche de l'écran: à tester). Je te conseil donc de passer l'élément en question en "position: absolute", ce qui te permettra de le placer tranquilement dans le cadre contenant l'image.
Une fois l'élément placé, un simple clic sur le lien href="#truc" renverra le navigateur sur l'élément d'identifiant "truc", et donc si celui-ci est placé au bon endroit dans l'image, l'utilisateur "sautera" à cet endroit dans l'image.
Effectivement c'est "moche"^^

j'aurais préféré pouvoir touché a un élément window, screen ou ducoment en JS pour qu'il déplace l'endroit affiché...
tu met ton positionnement absolu en CSS (il existe pas mal de moyen de centrer une fenêtre de manière absolue en crossbrowser). Ensuite le but de ton JS est d'animer cette boite pour que lorsque l'utilisateur clique sur un lien. Il déplace cette boite invisible au centre et face par exemple un fondu dessus Smile
A part via via top/right/left/bottom ou la méthode moche du hash, je n'ai pas d'alternative, Argorate.
t.bodeux : je suis pas sur que tu es bien saisie mon problème^^

Xenos, comment tu expliques qu'avec le zoom/dézoom en cliquant sur l'image (voir mon lien du premier topic), la window se positionne là où tu as cliquer (meme avec le overflow:hidden sur le body)!
Ca montre bien qu'il y a un truc pour le faire non?!
Pages : 1 2