Zoom sur une image lors d'un clic de la souris

Bonjour à tous.

voilà, je voudrais vous faire part de mon problème : je suis en train de réaliser depuis quelques temps un site internet de vente en ligne pour une entreprise américaine. cette entreprise vend du prêt-à-porter.

pour ce site, il y a donc une présentation des produits avec des images, et je souhaiterais incorporer une fonction de zoom afin que les clients puissent voir de très gros détails. cela fait plusieurs jours que je cherche, et j'ai bien trouvé de nombreux scripts comme un zoom au passage de la souris, ou l'utilisation de plusieurs images, mais rien ne correspond exactement à ce dont j'ai besoin.

donc pour expliquer la situation : j'ai créé un panneau d'administration pour ma cliente. elle n'y connait rien à l'informatique alors je lui ai créé un panneau pour uploader les photos de ses produits. le principe étant qu'elle prend une photo avec une assez grande résolution.

ensuite, j'utilise cette photo et la redimensionne directement en html sur chaque page où j'en ai besoin (j'utilise la propriété width="" des balises IMG). donc le but est de n'avoir qu'une seule photo qui est sous-dimensionnée, mais que je puisse zoomer/dézoomer dessus, et également changer d'image afin de voir les autres couleurs existantes (une photo par couleur).


voilà un exemple de ce qu'aimerais avoir ma cliente :
anntaylor
(cliquez sur "zoom and alternate views" en dessous de l'image)

je n'ai pas besoin d'un truc aussi poussé (pas besoin de fausse pop-up par exemple) mais le principe est là.


voilà j'en appelle donc à vos connaissances, parce que là, je sèche.

merci d'avance.
Disklad

Bonjour,

Le code utilisé est du javascript, et comme tout javascript sur une page html, il est possible de retrouver l'adresse du code pour t'en inspirer.

Source du javascipt

disklad a écrit :
ensuite, j'utilise cette photo et la redimensionne directement en html sur chaque page où j'en ai besoin (j'utilise la propriété width="" des balises IMG).

Bonjour la bande passante consommée et les temps de chargement pour l'utilisateur...

Salut,

Je sais bien que des fois les clients veulent des truc bizarres, mais ça c'est vraiment un effet completement inutile. Enfin pas tout a fait si tu fait un panoramique de 8000px, pourquoi pas. mais pour une photo, il est bien plus simple et bien plus agréable de la faire s'ouvrir en grand (tu peux utiliser un effet type "lightbox"). Surtout que la dimension de la photo zoomée rentrerais dans la pluspart des écrans!

zzzazzz a écrit :
Bonjour,

Le code utilisé est du javascript, et comme tout javascript sur une page html, il est possible de retrouver l'adresse du code pour t'en inspirer.

je sais bien mais je n'y connais vraiment rien en Javascript et là c'est vraiment trop compliqué, je ne suis pas capable de l'éditer. c'est pour cela que je posais la question. (je n'arrive même pas à trouver quel(s) script(s) font véritablement le zoom)

pour la bande passante je sais également que c'est loin d'être l'idéal, mais la cliente n'y connais vraiment rien en informatique, même retailler une image n'est pas à sa portée, alors le principe c'est que tout soit automatisé et qu'elle n'ait qu'à uploader la photo de son appareil.

sinon pour l'effet lightbox c'est ce que j'ai mis actuellement, et je suis en train de voir s'il y aurait une solution pour n'envoyer qu'une partie de l'image (sélectionnée par l'utilisateur) à envoyer dans le script lightbox. car les photos s'affichent en taille réelle donc pour du 2034*3072, c'est pas très pratique. si vous avez des infos la-dessus, je suis preneur.


j'avais trouvé un script qui renvoyait une sélection dans une sorte de cadre de zoom qui suivait la souris, je vais voir si je peux trouver quelque chose avec ça.
Modifié par disklad (04 Dec 2007 - 21:16)

disklad a écrit :
pour la bande passante je sais également que c'est loin d'être l'idéal, mais la cliente n'y connais vraiment rien en informatique, même retailler une image n'est pas à sa portée, alors le principe c'est que tout soit automatisé et qu'elle n'ait qu'à uploader la photo de son appareil.

Soit la cliente se forme (car gérer les contenus d'un site web demande quelques compétences, malgré les CMS... c'est bien pour ça qu'il y a des contrats de webmastering), soit il faut faire les redimensionnements côté serveur.