Se déplacer dans une image
cirion35
Messages postés
16
Date d'inscription
Statut
Membre
Dernière intervention
-
cirion35 Messages postés 16 Date d'inscription Statut Membre Dernière intervention -
cirion35 Messages postés 16 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je voudrai pouvoir afficher une image de très grand format sur ma page web et permettre une navigation horizontale et verticale. Le problème est qu'il faudrait que seule la partie visualisée soit chargée et non l'ensemble de l'image...
Il existe surement une application ou peut être même un site permettant d'obtenir ce résultat, j'espère pour voir vite trouver une solution.
Voir un peu le résultat obtenu et désiré mais très lourd... http://www.cirion.fr/galerie2010.html
++
Je voudrai pouvoir afficher une image de très grand format sur ma page web et permettre une navigation horizontale et verticale. Le problème est qu'il faudrait que seule la partie visualisée soit chargée et non l'ensemble de l'image...
Il existe surement une application ou peut être même un site permettant d'obtenir ce résultat, j'espère pour voir vite trouver une solution.
Voir un peu le résultat obtenu et désiré mais très lourd... http://www.cirion.fr/galerie2010.html
++
A voir également:
- Se déplacer dans une image
- Déplacer une colonne excel - Guide
- Image iso - Guide
- Légender une image - Guide
- Déplacer barre des taches windows 11 - Guide
- Reduire taille image - Guide
5 réponses
Salut.
Tu peux découper ton images en plusieurs.
Ensuite, tu crées un cadre contenant les images réassemblée, mais sans charger les images (donc en laissant l'attribut src vide).
Après, tu réduis ce cadre la taille d'une image.
Il faudra ajouter des flèches pour la navigation.
Lorsqu'on cliquera sur une flèche, il faudra charger l'image demandée en indiquant son chemin dans l'attribut src de la balise correspondante, puis faire un scrollTo.
Ou bien tu peux faire ça avec une seule balise <img /> et à chaque fois changer l'URL par l'image demandée. Tu ne pourras pas faire l'effet de défilement, mais tu pourras quand même faire un fondu.
Tu peux découper ton images en plusieurs.
Ensuite, tu crées un cadre contenant les images réassemblée, mais sans charger les images (donc en laissant l'attribut src vide).
Après, tu réduis ce cadre la taille d'une image.
Il faudra ajouter des flèches pour la navigation.
Lorsqu'on cliquera sur une flèche, il faudra charger l'image demandée en indiquant son chemin dans l'attribut src de la balise correspondante, puis faire un scrollTo.
Ou bien tu peux faire ça avec une seule balise <img /> et à chaque fois changer l'URL par l'image demandée. Tu ne pourras pas faire l'effet de défilement, mais tu pourras quand même faire un fondu.
Salut cirion35,
En fait si j'ai bien compris tu cherche une galerie?
Mais ton premier soucis, c'est la taille de tes images, j'en ai téléchargé une, elle fait 1105 ko, en appliquant un "enregistrement web" avec photoshop elle ne fait plus que 186 ko sans réelle dégradation.
Après, en fouillant un peu sur le web tu trouvera une multitude de galerie bien sympas.
regarde ici tu pourrai trouver ton bonheur:
http://www.kermarec.com/galeries-et-slideshows-de-photos-pour-mootools-14/
En fait si j'ai bien compris tu cherche une galerie?
Mais ton premier soucis, c'est la taille de tes images, j'en ai téléchargé une, elle fait 1105 ko, en appliquant un "enregistrement web" avec photoshop elle ne fait plus que 186 ko sans réelle dégradation.
Après, en fouillant un peu sur le web tu trouvera une multitude de galerie bien sympas.
regarde ici tu pourrai trouver ton bonheur:
http://www.kermarec.com/galeries-et-slideshows-de-photos-pour-mootools-14/
@Squel8: Je ne pense pas que tu aies compris le problème.
Ou alors c'est moi ... J'ai compris qu'il cherche à faire comme avec Google Maps, sauf que ce n'est pas une carte, mais une grande image.
J'ajoute que Shadowbox.js permet de faire cet effet, mais l'image doit être chargée complètement.
Ton ordinateur ne fait pas ce que tu veux ... mais ce que tu lui dis de faire.
Bonne année à tous
Ou alors c'est moi ... J'ai compris qu'il cherche à faire comme avec Google Maps, sauf que ce n'est pas une carte, mais une grande image.
J'ajoute que Shadowbox.js permet de faire cet effet, mais l'image doit être chargée complètement.
Ton ordinateur ne fait pas ce que tu veux ... mais ce que tu lui dis de faire.
Bonne année à tous
Oui c'est toi qui a raison, je ne fais que proposer une alternative, mais je ne répond pas à la demande. Je ne connais pas Shadowbox.js, je vais y jetter un coup d'oeil. j'ai découvrer ptviewer.jar > https://www.la-grange-numerique.com/demo9905/javademo/PTJV/bus.html
ça peut être sympa.
ça peut être sympa.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Hey,
Merci pour vos réponses, j'ai cru trouver le graal avec ptviewer mais malheureusement l'applet transforme l'image en coordonnées polaires et donc déforme complétement ma mozaique... et j'ai l'impression que l'ensemble de l'image est chargé au démarrage...
Finalement j'en suis au point de départ et c'est bien dommage...
@squel8, merci pour ta réponse, mais j'ai déjà une galerie bien fonctionnelle pour mon site ^^ (picsengine, parfaite!!)
@avion, ta méthode manuelle me semble bien laborieuse, vu la taille des images que je voudrais traiter...
J'espère trouver une solution au plus vite, ça devait faire les voeux de bonne année... ça attendra peut être un peu!!
++
Merci pour vos réponses, j'ai cru trouver le graal avec ptviewer mais malheureusement l'applet transforme l'image en coordonnées polaires et donc déforme complétement ma mozaique... et j'ai l'impression que l'ensemble de l'image est chargé au démarrage...
Finalement j'en suis au point de départ et c'est bien dommage...
@squel8, merci pour ta réponse, mais j'ai déjà une galerie bien fonctionnelle pour mon site ^^ (picsengine, parfaite!!)
@avion, ta méthode manuelle me semble bien laborieuse, vu la taille des images que je voudrais traiter...
J'espère trouver une solution au plus vite, ça devait faire les voeux de bonne année... ça attendra peut être un peu!!
++