Tom's Guide > Forum > Programmation > comment agrandir des photos en cliquant dessus

comment agrandir des photos en cliquant dessus

Forum Programmation : comment agrandir des photos en cliquant dessus

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !
Créer un nouveau sujet Répondre
Mot :    Pseudo :           
 
Moon@IDN   27-06-2004 à 08:38:19

bonjour!!!!

j'ai un petit prob avec mon site!:-(
j'aimerais que lorsqu'on clique sur une photo, elle s'ouvre dans une nouvelle fenetre....hors la nouvelle fenetre s'ouvre bien mais il n'y a pas moyen d'y faire afficher la photo cliquée. si cela peux vous aidez c'est une page preview et un code js qui sert pour toutes mes photos!!!
merci de m'aider!!!;-)
;-) :-( :-(

Répondre
Liens sponsorisés
Inscrivez-vous ou connectez-vous pour masquer ceci.
zak888   27-06-2004 à 08:57:57
- 0 +

Est-ce que tu veux quelque chose comme ceci ? : http://zak888.free.fr/mes_imgs.php

Si c'est le cas alors fais comme ceci :

miniature :

<a href="#" onclick="ImageMax('tonimage.jpg);"><img src="tonimage.jpg" width="213" height="160" border="0"></a>

Le script popup a mettre dans le header :

function ImageMax(chemin) {
html='<html> <head> <title>Titre</title> </head> <body bgcolor=black><IMG src="'+chemin+'" BORDER=0 NAME=ImageMax onLoad="window.resizeTo(document.ImageMax.width+40, document.ImageMax.height+60)"></body></html>';
popupImage = window.open('','_blank','toolbar=0, location=0, directories=0, menuBar=0, scrollbars=0, resizable=1');
popupImage.document.open();
popupImage.document.write(html);
popupImage.document.close()
};

Voilà c'est tout, pas la peine d'avoir plusieurs image, une seule suffit. ;-)

Edit : Bien sur c'est un javascript, n'oublie pas le <script language=javascript> ... </script>

Répondre à zak888
zak888   27-06-2004 à 09:17:09
- 0 +

Merci, j'aime bien faire de la pub détournée... :-D

Oups...je vais me faire virer si je continue :lol:

Répondre à zak888
Moon@IDN   27-06-2004 à 09:44:44
- 0 +

merci zak

le prob est que je ne c pas ou mettre le script que tu as donner !!!
oui c comme sur ton site que je veux faire
je te copie mon script aide moi stp!!!! merci!!! :-D :-D
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>prévisualisation</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<SCRIPT language="javascript1.2" src="code.js"></SCRIPT>
<script>
scrImage = location.search.substring(1,location.search.length);
</script>
<style type="text/css">
<!--
body {
background-color: #000000;
}
-->
</style>
</head>
</body>
<p><img alt=""src="" width="0" height="0" border="0" >
<table> </p>
<tr>
<td align="center"> <script>document.write("<img src='" + srcImage + "' border='0'>" );</script>
</center>
</table>
</td>
</tr>
<center>
<a href="javascript:window.close();">fermer la fenêtre</a>
</center>
</body></html>

voila je comprend rien......... je mets koi et ou??????
. :-( je suis un peu perdue

Répondre à Moon@IDN
zak888   27-06-2004 à 11:58:22
- 0 +

Entre les balises <head> et </head> (c'est ce que l'ont appelle le header) tu places ceci :

<script language=javascript>
function ImageMax(chemin) {
html='<html> <head> <title>Titre</title> </head> <body bgcolor=black><IMG src="'+chemin+'" BORDER=0 NAME=ImageMax onLoad="window.resizeTo(document.ImageMax.width+40, document.ImageMax.height+60)"></body></html>';
popupImage = window.open('','_blank','toolbar=0, location=0, directories=0, menuBar=0, scrollbars=0, resizable=1');
popupImage.document.open();
popupImage.document.write(html);
popupImage.document.close()
};
</script>

Et à l'endroit dans le body de ta page ou tu veux placer tes images tu places ceci :

<a href="#" onclick="ImageMax('tonimage.jpg);"><img src="tonimage.jpg" width="213" height="160" border="0"></a>

en remplacant tonimage.jpg par le nom de ton image...

Voilà :-)

bonne chance, confirme moi si ca marche...

Répondre à zak888
Moon@IDN   27-06-2004 à 12:36:52
- 0 +

merci d'avoir la patience de me repondre j'ai maintenant ce script:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script language=javascript>
function ImageMax(chemin) {
html='<html> <head> <title>Titre</title> </head> <body bgcolor=black><IMG src="'+chemin+'" BORDER=0 NAME=ImageMax onLoad="window.resizeTo(document.ImageMax.width+40, document.ImageMax.height+60)"></body></html>';
popupImage = window.open('','_blank','toolbar=0, location=0, directories=0, menuBar=0, scrollbars=0, resizable=1');
popupImage.document.open();
popupImage.document.write(html);
popupImage.document.close()
};
</script>
<title>prévisualisation</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<SCRIPT language="javascript1.2" src="code.js"></SCRIPT>
<script>
scrImage = location.search.substring(1,location.search.length);
</script>
<style type="text/css">
<!--
body {
background-color: #000000;
}
-->
</style>
</head>

</body>
<p><img alt=""src="" width="0" height="0" border="0" >
<table> </p>
<tr>
<td align="center"> <script>document.write("<img src='" + srcImage + "' border='0'>" );</script>
</center>
</table>
</td>
</tr>
<center>
<a href="javascript:window.close();">fermer la fenêtre</a>
</center>
</body><a href="#" onclick="ImageMax('vignettes/1.jpg);"><img src="images/1.jpg" width="500" height="700" border="0"></a>
</html>
on avance car j'ai une image qui s'ouvre dans ma nouvelle fenetre, mais c toujours la meme qui s'ouvre (images1) ca ne correspond pas avec l'image sur laquelle on clique

je suis pas douée!!!!!! :-P

Répondre à Moon@IDN
zak888   27-06-2004 à 12:41:22
- 0 +

remplace :
<a href="#" onclick="ImageMax('vignettes/1.jpg);"><img src="images/1.jpg" width="500" height="700" border="0"></a>

par :
<a href="#" onclick="ImageMax('images/1.jpg);"><img src="images/1.jpg" width="500" height="700" border="0"></a>

;-)
Tu n'as plus besoin de vignettes...

Citation :

je suis pas douée!!!!!!


Il y a un début à tout. :-)

Répondre à zak888
Moon@IDN   27-06-2004 à 12:52:40
- 0 +

:-? c'est toujours la meme image qui s'ouvre!!!
ca correspond pas a celle sur laquelle on clique :crying:

Répondre à Moon@IDN
zak888   27-06-2004 à 12:59:00
- 0 +

Je comprend pas la :-?

Le script fais que ton image (la grande) est réduite à l'état de vignette et lorsque l'on clique dessus elle s'ouvre en grand dans un popup, il faut donc que tu mettes le chemin d'accès de ta grande image... :-)

Répondre à zak888
Moon@IDN   27-06-2004 à 13:06:15
- 0 +

rien a faire ca veux pas changer d'image
la fenetre s'ouvre toujours avec images 1 et si j'enleve le 1 ya plus de photo dans la fenetre

Répondre à Moon@IDN
zak888   27-06-2004 à 13:09:02
- 0 +

Met le code de ta page actuelle stp

Répondre à zak888
Moon@IDN   27-06-2004 à 13:11:11
- 0 +

je ne comprend pas ce que tu veux dire quel code et quelle page??

Répondre à Moon@IDN
zak888   27-06-2004 à 13:14:59
- 0 +

Et bien la source de la page ou tu as tes vignettes...

Répondre à zak888
zak888   27-06-2004 à 13:16:53
- 0 +

Ah mais non que je suis bete !!!
le lien avec l'image de la vignette (la ligne que je t'ai fais corriger) se place entre les balises <body> et </body> ;-)

Répondre à zak888
noGaTh   27-06-2004 à 13:19:11
- 0 +

Pas besoin d'un tel JS pour commencer.

Pour aggrandir une image, rien de plus simple (et dans une nouvelle fenetre)

<a href="tonimage.jpg" target="_blank">clique pour voir l'image</a>

A la place de "clique pour voir l'image" tu peut inserer une image, en disant que c'est par exemple sa miniature :

<a href="tonimagegrande.jpg" target="_blank"><img src="tonimagepetite.jpg" border="0"></a>

Répondre à noGaTh
Moon@IDN   27-06-2004 à 13:23:47
- 0 +

ok je vais essayer mais me faut un petit moment!!!!!!! :-D

Répondre à Moon@IDN
Moon@IDN   27-06-2004 à 13:32:36
- 0 +

c pas toi qui est bete zak.....

meme entre les body c toujours la meme chose

Répondre à Moon@IDN
noGaTh   27-06-2004 à 13:43:39
- 0 +

moon, va pas t'embrouiller l'esprit avec des javascript pour débuter, tu va rien comprendre lol.

Apprends deja less bases :

www.allhtml.com tu as les bases sur les liens, les images, les tableau, les valeurs ainsi que leur proprietés et attributs.

Ensuite pour aller plus loin, et dynamiser ta page tu pourra utilisé des javascripts que tu trouveras : www.editeurjavascript.com . :)

Répondre à noGaTh
Moon@IDN   27-06-2004 à 13:45:10
- 0 +

merci noGaTh!!!*

ca marche mais il faut refaire toute mes pages alors!!!
:-P

Répondre à Moon@IDN
noGaTh   27-06-2004 à 17:10:27
- 0 +

Et oui, tu es obligé de tout remodifier, plus tard, tu pourra te mettre au php/sql qui permettra une mise a jour instantané, vu que ca sera genrer dans une "boucle" pour afficher ce que tu veux. Donc tout sera plus facile, mais avant de voir tout ca, je te conseil d'apprendre les bases de l'html, savoir constitué normalement et sans faute, les liens ahref, mail, les tableau, avec tr et td, la balise font etc ;o)

Répondre à noGaTh
Créer un nouveau sujet Répondre
Tom's Guide > Forum > Programmation > comment agrandir des photos en cliquant dessus
Aller à :

Il y a 739 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Plan du forum
Forum Bestofmedia ©
2000-2009 Bestofmedia Group
Page générée en 0,292 secondes
Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler
Liens