Zoom sur une image

**flo456** · 17/05/2006, 08h40

bonjour,
j'aimerais savoir s'il est possible de mettre une fonction zoom sur une image.

j ai une page asp qui m affiche une petite image qui se trouve dans un dossier upload. Mais je ne veux pas créer une image plus grande. y a t il un moyen de faire un zoom sur l image sans en créer une plus grande?
comme sur le clique droit de la souris.. defois il y a le zoom..

merci

ps: j ai fait des recherches sur le forum, y a des sujets interessant mais je n ai jamais fait de javascript..

**Sheriff** · 17/05/2006, 09h51

salut !
tu peux écrire une fonction qui redimensionne l'image...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function zoom_plus(){
if (document.image.style.height==200){document.image.style.height=400;document.image.style.width==800;}
}

et dans la page tu fais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src=url border=0 name=image><a href=javascript:zoom_plus()>Agrandir</a>

et tu fais le contraire pour diminuer la taille de l'image...
@+

**flo456** · 17/05/2006, 10h06

j ai essayé mais rien ne se passe..
faut il que j écrive comme ca?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="#" onClick="javascript:zoom_plus()"><img src="../upload/<%=img%>"width="100" height="100">Agrandir</a>

ca devrai fonctionner non?

j ai mit dans la meme page mais au sommet :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<script language="Javascript"> 
function zoom_plus()
{
 if (document.image.style.height==200){document.image.style.height=400;document.image.style.width==800;}
}
</script>

(c est le code que tu m as donné!)

ou alors il faut que ca ouvre une autre page pour afficher l image?

**Sheriff** · 17/05/2006, 10h11

ca ne peut mas agrandir puisque la condition n'est pas remplie...
remarque que la taille initiale de ton image est height=100 et non height=200

**flo456** · 17/05/2006, 10h13

j ai changé ca.. j ai vu par apres mais quand je clique sur le lien.. rien ne se passe. il met juste au fond : erreur sur la page..

**Sheriff** · 17/05/2006, 10h14

dans ton cas tu dois faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function zoom_plus(){
if (document.image.style.height==100){document.image.style.height=200;document.image.style.width==200;}
}

et dans la page

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="#" onClick="javascript:zoom_plus()"><img src="../upload/<%=img%>" width="100" height="100" name="image">Agrandir</a>

c'est important que ton image ait un name...

**flo456** · 17/05/2006, 10h17

je suis désolée mais ca ne change rien..
rien ne se passe et il y a toujours : erreur sur la page...

**Sheriff** · 17/05/2006, 10h39

ok je te refile le code entier

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<script type=text/javascript>
function zoom_plus(){
if (document.getElementById('lien').title=='petite image'){document.image.style.width=200;document.image.style.height=200;document.getElementById('lien').title='grande image';}
}
</script>

dans la page tu fais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href=javascript:zoom_plus()>zoom +</a><a title='petite image' href='#' id='lien'><img name='image' src='url' width=100 height=100 border=0></a>

@+

**flo456** · 17/05/2006, 10h43

excuse moi mais je fais exactement ce que tu me dis depuis tout a l heure et ca ne change rien!

je mets mon bout de script juste avant la fermeture du <head>

tu as testé? parce que chez moi .. ca mets toujours : erreur sur la page..

je suis vraiment désolée..

**Sheriff** · 17/05/2006, 10h58

voici mon code
tu peux le tester directement, même sans image...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
	<head>
	<script type=text/javascript>
function zoom_plus(){
if (document.getElementById('lien').title=='petite image')
{document.image.style.width=200;document.image.style.height=200;document.getElementById('lien').title='grande image';}
else
{document.image.style.width=100;document.image.style.height=100;document.getElementById('lien').title='petite image';}
}
</script>
	</head>
<body>
	<a href=javascript:zoom_plus()>zoom</a><a href='#' title='petite image' id='lien'><img name='image' src='url' width=100 height=100></a>
</body>
</html>

@+

**Sheriff** · 17/05/2006, 11h00

si ça marche toujours pas...

au fait c quoi ton navigateur ?
j'utilise ie, moi.

**flo456** · 17/05/2006, 11h01

et bien.. je ne sais pas ce qu a ma page mais.. ca va pas..

tampis.. merci quand meme,.,.

**Sheriff** · 17/05/2006, 11h05

non, non...
sauvegarde mon code en tant que page html à part et exécute-la.
c'est peut-être un problème de conflit avec les autres variables de ton programme.
je veux m'assurer que mon code fonction en solitaire chez toi...

ça ne fait pas 2 jours que j'ai eu le même problème et je t'assure que c ce code que j'utilise !!!

**flo456** · 17/05/2006, 11h09

alors c est ma page qui ne vas pas..
il fonctionne bien c est vrai..
comment puis-je faire? pourtant je n ai qu une fonction javascript dans ma page..

**flo456** · 17/05/2006, 11h11

alors c est ma page qui ne vas pas..
il fonctionne bien c est vrai..
comment puis-je faire? pourtant je n ai qu une fonction javascript dans ma page..

**Sheriff** · 17/05/2006, 11h19

nous y voila

va dans mon code et renomme les variables que tu as peut-être utilisés dans ton programme.
par exemple le name de l'image, le id de la balise <a id=lien>, le nom de la fonction, etc.

ok ?

**Sheriff** · 17/05/2006, 11h22

et si tu me disais quel est le message renvoyé par l'erreur ?

**flo456** · 17/05/2006, 11h24

ok ca j ai fait. j ai essayé ca fonctionne dans ta page.
mais toujours pas dans la mienne..

j ai regarder la hauteur de mon tableau..il y a de la place pour l image en grand pourtant.

quand je clique sur zoom, rien ne se passe

sauf que dans ma barre internet en bas, ca écrit : erreur sur la page avec le triangle jaune..