Agrandir une image en javascript

Javascript

chlagovich Messages postés 89 Statut Membre -
juanou Messages postés 145 Statut Membre - 29 mars 2010 à 00:07

Bonjour,
une fonction javascript qui permet d'agrandir une image et aussi une fonction qui permet de parcourir des images sans
passer dans une autre page

Afficher la suite

A voir également:

Agrandir une image au clic javascript
Agrandir une image - Guide
Supprimez les composantes rouge et verte de cette image. quel mot apparaît ? - Forum Word
Légender une image - Guide
Image iso - Guide
Frédéric cherche à faire le buzz sur les réseaux sociaux. il a ajouté une image de manchots sur une image de plage. retrouvez l'image originale de la plage. que cachent les manchots ? ✓ - Forum Windows

4 réponses

Réponse 1 / 4

juanou Messages postés 145 Statut Membre 58

Pour agrandir des images sans changer de page, comme pour visionner des diaporamas, je te suggère ce script prêt à l'emploi :

https://reactdom.com/restful-api/

Réponse 3 / 4

Yoh K

Je voulais savoir, quand on a passé la souris sur l'image, elle s'agrandit. Mais pour faire en sorte qu'elle revienne à sa taille originelle, il faut ajouter une balise supplémentaire?

Merci d'avance

paleodoc

je suis tombé sur ta question, pcq je cherchais la même chose. Après avoir bricolé le code, en voici un extrêment simple qui affiche l'image en petite taille à l'ouverture de la page, l'agrandit quand on passe la souris dessus, et la fait revenir à la taille vignette quand on n'est plus dessus. Et tout ça avec une seule ligne de programme. Allez voir sur mon site, partie musée (www.histoire-geriatrie.com)

<IMG SRC="nomimage.gif" WIDTH=50 HEIGHT=50 ALIGN=bottom onmouseout="this.height=50; this.width=50" onmouseover="this.height=189; this.width=425">

les premiers width et height forcent le navigateur à afficher l'image petite.
onmouseout fait revenir l'image à la taille vignette
onmouseover agrandit l'image quand la souris passe dessus. dans mouse over il faut mettre la taille exacte de l'image en grand format (this.height (hauteur) et this.width (pour la largeur).

j'y ai passé du temps, pcq je suis pas spécialiste, mais le résultat est nickel !

bien amicalement

jp

nideka > paleodoc

Je cherche la formule pour agrandir une image au passage de la souris.
J'ai bien trouvé vos conseils dans "comment ça marche" effectivement, pour moi ça marche,
mais c'est désastreux. L'image est trouble et le texte écrit à côté se décale d'autant en hauteur que
l'image s'agrandit.
Je n'ai pas trouvé sur votre site le "musée" pour constater vos résultats personnels.
Donc, pourriez vous m'indiquer en quel format l'image doit être affichée au départ dans l'éditeur pour que
l'image agrandie ne soit pas trouble.
Merci pour votre aide

paleodoc > nideka

le format d'image n'a aucune importance (jpg, gif, etc).
il faut par contre ne pas se tromper dans la taille : préciser exactement la taille en pixels (pour la grande taille, mettre le nombre exact de pixels de la taille normale de l'image), puis mettre la taille en pixels de la vignette. comme ça à l'agrandissement, la taille normale sera affichée et nette.
effectivement j'ai viré ce code de mon site, les images se décalant en bas de page devenaient invisibles en partie

nideka > paleodoc

Je repasse par ici pour la suite de la conversation car les liens du mail ne fonctionnent pas.
Donc, merci de m'avoir répondu, mais ça ne résoud pas mon problème car apparemment vous rencontrez le même, sinon la netteté e l'image, au moins le décalage si j'ai bien compris ce que vous indiquez ci-après retranscrit :" effectivement j'ai viré ce code de mon site, les images se décalant en bas de page devenaient invisibles en partie"
jusqu'à présent j'utilisais la méthode de la double photo soit la vignette dans mon dossier image avec lien vers
une page web contenant la grande image. Ca fonctionne bien, mais c'est lourd au niveau de la manipulation donc
je cherchais autre chose. Votre façon de procéder est pas mal, même plutôt bien comme truc, mais il doit manquer quelque chose.
L'idéal serait un agrandissement très net au passage de la souris sans provoquer de déplacement des données existantes.
Ca doit sûrement exister. Merci de m'avoir aidée.

@lain > nideka

J'arive peut-être un peu tard mais pour éviter le flou de l'image il faut travailler avec une vignette de petite taille et l'image en taille normal sinon ça sera désastreux !

Bonne journée
@lain

Réponse 4 / 4

Aquarelle89 Messages postés 25 Statut Membre 3

Ta formule est super!

Ca fait plus d'un mois que je rame et que je bidouille des formules avec le onmouseover pour trouver qqchose qui fonctionne avec mes photos et là ça marche super bien! Tu t'es pas cassé le c** pour rien!

Merci mille fois!!

paleodoc

salut aquarelle,

bien content que ça te serve. De mon côté, j'ai viré cette fonction de mon site, pcq avec des images de grande taille, ça couvre tout le reste et si c'est en bas de page, tu vois pas le bas de l'image, et tu peux pas faire défiler la page vers le bas, sauf si tu as une souris à roulette
bonne continuation

Discussions similaires

affichage d une variable js dans page html

[JAVASCRIPT] Changer de feuille de style CSS

activer/ desactiver bouton en javascript

[JS]récupérer valeur d'un input radio?

mailto, javascript et insertion code html...

Recuperer contenu div via javascript

Agrandir une image en javascript

4 réponses

Votre réponse

Discussions similaires

Newsletters