je recherche un JavaScript pour agrandir une photo

Développement, conception de sites web, PHP, (X)HTML, ASP, Ajax, CSS, Javascript, Flash, MySQL, et autres ont leurs entrées dans cette section. On peut aussi parler d'hébergement, de maintenance, de sécurité...

Modérateur: Modérateurs

je recherche un JavaScript pour agrandir une photo

Messagepar mcjp » 22 Jan 2009 18:40

Bonjour,
Je suis à la recherche d'un script pour donner une effet de zoom quand on passe la souris sur une photo dans mes pages web. (comme dans galerie windows) j'ai beaucoup de photos donc, j'aimerais trouver un script pas trop long à mettre en route.
Merci d'avance.
mcjp
 
Messages: 31
Inscription: 16 Jan 2009 19:02

Re: je recherche un JavaScript pour agrandir une photo

Messagepar werewolf » 22 Jan 2009 22:09

Salut !

Voici quelques idées :

http://www.jejavascript.net/imag_zoom.php
http://www.javascript-fx.com/navigation ... /help.html (en anglais)

Sinon, un truc simple :
Code: Tout sélectionner
<img src="image1.jpg" onmouseover="this.width=this.width*2;" onmouseout="this.width=this.width/2;"> -
<img src="image2.jpg" onmouseover="this.width=this.width*2;" onmouseout="this.width=this.width/2;">

Normalement, ça augmente la largeur ET la hauteur. Sous Firefox 3 et IE7, en tous cas.
Inconvénient : faut remanier tous les codes des images à modifier.
Avantage : vive le copier-coller !
Avatar de l’utilisateur
werewolf
Libellulien Junior
Libellulien Junior
 
Messages: 196
Inscription: 25 Fév 2004 08:43
Localisation: Québec

Re: je recherche un JavaScript pour agrandir une photo

Messagepar mcjp » 23 Jan 2009 00:46

bonsoir
merci pour ta réponse. le site jejavascript, je le connais mais il ne fonctionne pas avec mon IE7. d'après le concepteur, il marche. Il a aussi le désavantage de devoir remanier chaque image mais en grand format ce qui est très difficile pour voir la construction de ta page qui parait elle avec une image réduite.
Je vais essayer ton script. de toute façon, pour mon site, j'ai mis un comportement qui a nécessité un travail sur chaque image.
A+ pour les nouvelles
mcjp
 
Messages: 31
Inscription: 16 Jan 2009 19:02

Re: je recherche un JavaScript pour agrandir une photo

Messagepar mcjp » 23 Jan 2009 00:48

salut,
encore une question, qu'elle format d'image faut-il mettre dans ton script la petite ou la grande
merci
mcjp
 
Messages: 31
Inscription: 16 Jan 2009 19:02

Re: je recherche un JavaScript pour agrandir une photo

Messagepar werewolf » 23 Jan 2009 01:22

Euh... pouvez répétez la question ?

Je n'utilise pas plusieurs formats d'une image, là. Je modifie juste la taille de l'image, pas la source de l'image.

Pour avoir une bonne définition, il est préférable d'utiliser une image de bonne dimension, et de réduire sa taille à l'affichage. Ainsi, quand tu en as besoin, tu l'agrandis sans pixeliser.

Si tu veux avoir une taille définie en mode «normal», voici une modification du code :
Code: Tout sélectionner
<img src="image1.jpg" onmouseover="this.width=this.width*2;this.height=this.height*2;" onmouseout="this.width=this.width/2;this.height=this.height/2;" height="50" width="50">


onmouseover="this.width=this.width*2;this.height=this.height*2;" permet de doubler la largeur et la hauteur. Obligatoire si tu fixes la taille de ton image avec height="50" width="50". Si tu ne fixes pas de taille, juste onmouseover="this.width=this.width*2;" suffit, car l'image garde son ration hauteur/largeur.

Si j'ai bien compris ta dernière question (ce qui n'est peut-être pas le cas), je n'utilise qu'une seule image, celle d'origine. Je n'utilise pas de miniature de cette image. Ça évite d'avoir d'autres images à charger (si tu as 20 images, tu en charges 40 avec les miniatures), entre autres choses .
Avatar de l’utilisateur
werewolf
Libellulien Junior
Libellulien Junior
 
Messages: 196
Inscription: 25 Fév 2004 08:43
Localisation: Québec

Re: je recherche un JavaScript pour agrandir une photo

Messagepar mcjp » 23 Jan 2009 20:11

salut,
merci beaucoup pour ta réponse. En effet, en faisant mon système, je devais charger 40 photos au lieu de 20. Encore une question, où je dois mettre le script dans heat, body, image? A+
mcjp
 
Messages: 31
Inscription: 16 Jan 2009 19:02

Re: je recherche un JavaScript pour agrandir une photo

Messagepar mcjp » 23 Jan 2009 20:36

j'ai écris une réponse mais je n'arrive pas à l'annuler.
Dernière édition par mcjp le 23 Jan 2009 20:53, édité 1 fois.
mcjp
 
Messages: 31
Inscription: 16 Jan 2009 19:02

Re: je recherche un JavaScript pour agrandir une photo

Messagepar mcjp » 23 Jan 2009 20:48

salut,
J'ai trouvé et ça marche bien dans Firefox mais pas dans IE7. J'ai regardé dans les options si quelque chose était désactivé mais je n'ai rien trouvé. Que se passe t-il?
merci encore pour ton script parce que je devais charger 40 photos pour 20 comme tu l'a très bien compris.
A +
mcjp
 
Messages: 31
Inscription: 16 Jan 2009 19:02

Re: je recherche un JavaScript pour agrandir une photo

Messagepar werewolf » 23 Jan 2009 21:43

Salut !

En fait, il n'y a pas vraiment de script. On appelle juste des fonctions Javascript sur des évènements sur les images. Or donc, ce code se colle dans la balise img, comme indiqué dans l'exemple.

Si tu travail avec un langage coté serveur (PHP, ASP, Coldfusion, ...), intégré ce code dans une boucle d'affichage est un jeu d'enfant. Sinon, faut tout coller à la main, mais ce n'est pas si terrible. :-D

Je viens d'essayer de nouveau sur IE7, et chez moi, ça marche bien. Il y a juste le contrôle de code malicieux qui peut poser problème. Malheureusement, il n'y a rien à faire contre ça, si la personne a activer ce "contrôle", tous les javascript seront interceptés...

Si tu veux, envoies moi l'adresse de ta page en message privé, et j'irais voir, avec FF et IE, s'il y a des soucis.

Voilà ! Si tu as d'autres problèmes, tu sais où me trouver !
Avatar de l’utilisateur
werewolf
Libellulien Junior
Libellulien Junior
 
Messages: 196
Inscription: 25 Fév 2004 08:43
Localisation: Québec

Re: je recherche un JavaScript pour agrandir une photo

Messagepar mcjp » 24 Jan 2009 08:23

salut

j'ai trouvé le problème pour IE7. j'avais dans mon code une incompatibilité que j'ai pu réparer en effaçant la ligne de problème. Maintenant ça marche. Je te laisse l'adresse de mon site non encore modifié, si tu trouve dans le code un truc qui couice. Tu verra par toi-même que j'ai déjà bien planché dessus. :P
Encore merci.
http://www.artisansdart.ch
Encore une chose, j'aimerais faire une petite bannière pour pouvoir demander de l'insérer dans mes liens amis. comment la fabriquer?
A+
mcjp
 
Messages: 31
Inscription: 16 Jan 2009 19:02


Retourner vers Développement, conception de sites web

Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités