Votre question

Agrandir photos dans dreamweaver

Tags :
  • Dreamweaver
  • Programmation
Dernière réponse : dans Programmation
15 Février 2010 15:51:36

Sous Dreamweaver 8, des images en petit format sur une page.

Je souhaite que quand on clique sur l'une d'elle, elle s'agrandisse sur le même écran dans une petite fenê
tre
Ca fait des heures que je rame sans y arriver.

Merci de m'aider

Autres pages sur : agrandir photos dreamweaver

20 Février 2010 21:48:02

autre solution : faire tes galeries photos avec photoshop et ensuite retoucher le codage dans dream pour optimiser les pages car toshop ne met pas toutes les balises ni textes voulu, sinon bien sur il y a une foule de scripts en open source ...
m
0
l
Contenus similaires
21 Février 2010 09:44:09

tracks@idn a dit :
Bonjour,
Je te conseil d'utiliser une galerie déjà faire en javascript comme http://www.huddletogether.com/projects/lightbox2/ sinon une manière simple reste la popup, mais c'est effectivement une autre fenetre qui va s'ouvrir.



Merci de ces infos, un peu trop techniques pour moi (css, js, ... §termes inconnus)
Je suis retraité et j'y âte un peu pour le plaisir mais je suis loin d'être un spécdialiste
Vous me parlez de popups qui s'ouvriraient dans une autre fenêtre : si elle est est plus petite que l'origine et ne masque donc qu'une partie de l'origine et que l'on peut fermer par après pour retrouver l'origine, cela m'intéresserait pour auant quze cela n'implique pas trop de techniques compliquées.
Merci cependant de votre première réponse. :hello: 
m
0
l
21 Février 2010 11:31:58

as-tu photoshop ?
as-tu lu ma réponse ?
m
0
l
22 Février 2010 18:40:36

:bounce:  Merci de ta réponse.

Désolé, mais chez nous (Belgique-Morlanwelz) c'est une période de grosse s activités folkloriques (carnaval) et je n'ai pas été, dès lors, très présent sur ma messagerie.
Je vais cependant tenter de mettre en pratique ton conseil dont je te remercie beaucoup.
m
0
l
22 Février 2010 20:23:20

likelolo a dit :
:bounce:  Merci de ta réponse.

Désolé, mais chez nous (Belgique-Morlanwelz) c'est une période de grosse s activités folkloriques (carnaval) et je n'ai pas été, dès lors, très présent sur ma messagerie.
Je vais cependant tenter de mettre en pratique ton conseil dont je te remercie beaucoup.

:pt1cable: 
à consommer avec modération ...
tiens-nous au courant !
@+
m
0
l
22 Février 2010 20:24:32

tiens-nous au courant alors ... @+
m
0
l
1 Mars 2010 09:49:35

J'ai démissionné, j'ouvre mes images dans une autre fenêtre ! :pfff: 
m
0
l
1 Mars 2010 14:24:41

likelolo a dit :
J'ai démissionné, j'ouvre mes images dans une autre fenêtre ! :pfff: 

ben ce n'est pas ainsi que tu vas progresser ! on est tous passés par là et avec un peu de 'ténacité' on finit toujours par y arriver ...
m
0
l
1 Mars 2010 21:13:23

Fait une fenêtre pop op

tu pourras mettre ton image en taille réelle et de plus apparaitra dans une petite fenêtre et donc en vue la fenêtre origine et la fenêtre de ton image
m
0
l
1 Mars 2010 21:19:16

tom0000 a dit :
Fait une fenêtre pop op

tu pourras mettre ton image en taille réelle et de plus apparaitra dans une petite fenêtre et donc en vue la fenêtre origine et la fenêtre de ton image

les popups sont de plus en plus mal vus sur le net, pas mal de navigateurs les interdisent par défaaut et tout le monde ne sait pas forcément les autoriser, ou ne veut pas ... résultat les visiteurs partent ... et ne reviennent plus !
:cry: 
m
0
l
2 Mars 2010 10:13:09

bg62 a dit :
les popups sont de plus en plus mal vus sur le net, pas mal de navigateurs les interdisent par défaaut et tout le monde ne sait pas forcément les autoriser, ou ne veut pas ... résultat les visiteurs partent ... et ne reviennent plus !
:cry: 


Les popups déclenchées par action utilisateur ne sont pas bloquées par les navigateurs, seules les automatiques, au onload par exemple.

Par exemple : <a href="image_big.jpg" onclick="javascript:window.open(this.href, 'nom', ''); return false;" title="agrandir l'image [nouvelle fenêtre]"><img src="image_small.jpg" alt="agrandir l'image [nouvelle fenêtre]"></a>

Mais la solution lightbox (http://www.huddletogether.com/projects/lightbox2/) est normalement très simple a mettre en œuvre.
m
0
l
2 Mars 2010 11:00:42

Citation :
Par exemple : <a href="image_big.jpg" onclick="javascript:window.open(this.href, 'nom', ''); return false;" title="agrandir l'image [nouvelle fenêtre]"><img src="image_small.jpg" alt="agrandir l'image [nouvelle fenêtre]"></a>

tout à fait d'accord, mais très mal suivi par les moteurs (donc pour google images ....)
c'est pourquoi la solution d'une galerie photo, ouvrant chaque image dans une page réelle est bien plus efficace, soit à l'aide d'un script, soit comme je l'avais déjà dit avec photoshop ou autre qui créent tout ça en 'automatique' ... reste ensuite à optimiser un peu les pages générées ...
il y a aussi ce petit soft assez pratique pour les débutants:
http://www.jmberthier.com/fr/photogallery.html
:hello: 
m
0
l
2 Mars 2010 11:25:05

Si les photos sont masqué par JS on ne perd rien du référencement, et l'expérience utilisateur et quand même bien meilleur :) 

Edit : ah, vous deviez surement parler des popup et non des lightbox, je n'ai donc rien dis.
m
0
l
2 Mars 2010 11:49:11

Citation :
masqué par JS

non 'bloquées' dans certains cas ... car il y a JS et JS ...
regarde sur mon site principal tu y verras toutes les variantes possibles html (php), JavaScript etc ... et bien plus d'ailleurs pour optimiser au niveau de la prise en compte par les moteurs ... ;) 
m
0
l
9 Mars 2010 09:07:19

:wahoo:  Merci à tous de ces tentatives d'explications, mais cela devient très technique pour ma petite personne.
Merci à tous de votre solidarité.
m
0
l
30 Août 2011 17:45:00

bg62 a dit :
Citation :
masqué par JS

non 'bloquées' dans certains cas ... car il y a JS et JS ...
regarde sur mon site principal tu y verras toutes les variantes possibles html (php), JavaScript etc ... et bien plus d'ailleurs pour optimiser au niveau de la prise en compte par les moteurs ... ;) 

Bonjour Bg62
j'ai regardé ton site où se trouver les fonds d'ecran, c'est exactement ce que je veux faire : une page avec de petites photos, en cliquant sur l'une d'elles elle s'agrandit mais le must c'est la croix pour fermer l'agrandissement tout en restant dans la même page avec toutes les vignettes, merci de bien vouloir m'indiquer le code stp , je suis avec dream 8
un grand merci Marieoceane
m
0
l
31 Août 2011 13:38:01

bg62 a dit :
Citation :
masqué par JS

non 'bloquées' dans certains cas ... car il y a JS et JS ...
regarde sur mon site principal tu y verras toutes les variantes possibles html (php), JavaScript etc ... et bien plus d'ailleurs pour optimiser au niveau de la prise en compte par les moteurs ... ;) 

Bonjour j'ai bien regardé, celle où on trouve plusieurs images car j'en ai au moins 30 me plait beaucoup mais bon je ne suis pas une pro, de plus l'anglais!!! pas trop pour moi, je n'ai donc vu comment procéder pour mettre le code dans ma page, on ne peut avoir un petit tuto pour cela s'il te plait? ce serait super sympa, les autres modèles utilisent des logiciels que je ne connais pas du tout et ne sont pas en français, j'ai fait un essai en cliquant sur une petite image elle s'agrandit dans une autre fenêtre mais si je mets un lien de cette fenêtre vers la page principale, cela se place en haut de la page et non à son emplacement, l'ancre nommée ne fonctionne pas pour cela, merci encore à toi
Marieoceane
m
0
l
31 Août 2011 15:11:07

marieoceane a dit :
Bonjour j'ai bien regardé, celle où on trouve plusieurs images car j'en ai au moins 30 me plait beaucoup mais bon je ne suis pas une pro, de plus l'anglais!!! pas trop pour moi, je n'ai donc vu comment procéder pour mettre le code dans ma page, on ne peut avoir un petit tuto pour cela s'il te plait? ce serait super sympa, les autres modèles utilisent des logiciels que je ne connais pas du tout et ne sont pas en français, j'ai fait un essai en cliquant sur une petite image elle s'agrandit dans une autre fenêtre mais si je mets un lien de cette fenêtre vers la page principale, cela se place en haut de la page et non à son emplacement, l'ancre nommée ne fonctionne pas pour cela, merci encore à toi
Marieoceane

si c'est pour la page d'accueil du script ... un 'tuto' ... non ?
pas trop le temps ;) 
mais tu peux toujours regarder dans le code source les appels en javaScript, la css et le codage html ... ce sera largement suffisant pour y arriver :hello: 
m
0
l
31 Août 2011 15:26:16

bg62 a dit :
si c'est pour la page d'accueil du script ... un 'tuto' ... non ?
pas trop le temps ;) 
mais tu peux toujours regarder dans le code source les appels en javaScript, la css et le codage html ... ce sera largement suffisant pour y arriver :hello: 

merci pour ta réponse, je comprends bien que tu n'es pas le temps de refaier la page d'accueil bien sur, j'ai copié ta source à l'endroit où on voit les vignettes, j'ai pris une image au milieu de toutes mes images voir si le pop up revient au même endroit, mais bon, il ne se fait pas, j'ai loupé quelque chose, tant pis pour moi, je ne trouve pas de tuto pour cette façon de faire, je sais créer ma page htlm bien sur mais après pour les scripts et autre je dois louper quelque chose dans ta source et cela ne fonctionne pas, il ne suffit pas de copier/coller de <div à < /di> et changer le nom de l'image, je ne vois pas, tant pis, je cherche merci à toi
Marieoceane :pt1cable: 
m
0
l
a c 232 L Programmation
31 Août 2011 16:34:04

Est-ce que tu peux mettre un lien vers ta page si elle est disponible sur le net ?
Ou donner le code de ta page ?
m
0
l
31 Août 2011 16:34:18

marieoceane a dit :
merci pour ta réponse, je comprends bien que tu n'es pas le temps de refaier la page d'accueil bien sur, j'ai copié ta source à l'endroit où on voit les vignettes, j'ai pris une image au milieu de toutes mes images voir si le pop up revient au même endroit, mais bon, il ne se fait pas, j'ai loupé quelque chose, tant pis pour moi, je ne trouve pas de tuto pour cette façon de faire, je sais créer ma page htlm bien sur mais après pour les scripts et autre je dois louper quelque chose dans ta source et cela ne fonctionne pas, il ne suffit pas de copier/coller de <div à < /di> et changer le nom de l'image, je ne vois pas, tant pis, je cherche merci à toi
Marieoceane :pt1cable: 

il faut aussu les fichiers js et css ;) 
m
0
l
1 Septembre 2011 10:26:54

OmaR a dit :
Est-ce que tu peux mettre un lien vers ta page si elle est disponible sur le net ?
Ou donner le code de ta page ?

Bonjour Omar et Bg2 c'est super gentil, j'ai passé larpès midi à faire des essais en vain, j'ai vu le même système sur un blog mais en regardant la source il semble que c'est un logiciel intégré au système du blog, je suis loin d'être un pro, au début une de mes filles m'a aidé, et là je reprends tout avec dream, je vous envoie la source car je ne l'ai pas mise en ligne, si vous voyiez des bêtise ne vous moquez pas svp, lol. cela risuqae d'être long sur la fenêtre!! j'envoie aussi la source d'une image pour que vous compreniez car l'image s'affiche en grossissant, je prends une image du milieu comme cela je vois si elle reviens à son point initial, un très très grand merci, il n'y a pas de js et de css dans cette page.
La copie de la source s'arrêtte avant table, body etc pour ne pas en mettre trop
source de la page
  1. <html>
  2. <!-- Date de création: 23/06/03 -->
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  5. <title>journal p5</title>
  6. <meta name="description" content="">
  7. <meta name="keywords" content="">
  8. <meta http-equiv="imagetoolbar" content="no">
  9. <link rel="alternate" media="print" href="Nouveau dossier/fete_print_doc.txt">
  10.  
  11. <!-- Son de fond -->
  12.  
  13.  
  14. <!-- Empecher le clic droit -->
  15. <SCRIPT LANGUAGE="JavaScript">
  16. function clicie() {
  17. // Fonction de détection pour Internet Explorer
  18. if ((event.button==2)||(event.button==3)) {
  19. alert("Respectez les droits d'auteur.");
  20. }
  21. }
  22. function clicns(e){
  23. // Fonction pour Netscape
  24. if(e.which==3){
  25. alert("Respectez les droits d'auteur.");
  26. return false;
  27. }
  28. }
  29.  
  30.  
  31. if (document.all) { document.onmousedown=clicie;}
  32. if (document.layers) {document.captureEvents(Event.MOUSEDOWN); document.onmousedown = clicns;}
  33. if (window.sidebar) {document.captureEvents(Event.MOUSEDOWN); document.onmousedown = clicns;}
  34. </SCRIPT>
  35.  
  36.  
  37. <!-- Fin clic droit -->
  38.  
  39. <!-- Empecher selection texte -->
  40. <script type="text/javascript">
  41. <!-- debut
  42. function deselect(e)
  43. {return false;}
  44. function select()
  45. {return true;}
  46. document.onselectstart=new Function("return false");
  47. if (window.sidebar)
  48. {
  49. document.onmousedown=deselect;
  50. document.onclick=select;
  51. }
  52. // fin -->
  53. </script>
  54. <!-- fin empecher selection -->
  55.  
  56.  
  57. <!-- Empecher selection texte -->
  58. <script type="text/javascript">
  59. <!--
  60. <!-- debut
  61. function deselect(e)
  62. {return false;}
  63. function select()
  64. {return true;}
  65. document.onselectstart=new Function("return false");
  66. if (window.sidebar)
  67. {
  68. document.onmousedown=deselect;
  69. document.onclick=select;
  70. }
  71. // fin -->
  72.  
  73. function MM_openBrWindow(theURL,winName,features) { //v2.0
  74. window.open(theURL,winName,features);
  75. }
  76. //-->
  77. </script>
  78. <!-- fin empecher selection -->
  79.  
  80.  
  81. <!-- Info bulle -->
  82. <style>
  83. <!--
  84. .popper
  85. {
  86. position : absolute;
  87. visibility : hidden;
  88. }
  89.  
  90. body {
  91. background-image: url(../Photos/fonds_de_page/fondjournal.jpg);
  92. }
  93. .Style1 {font-family: Algerian}
  94. .Style6 {
  95. font-family: Arial, Helvetica, sans-serif;
  96. font-size: 14px;
  97. font-weight: bold;
  98. }
  99. .Style9 {font-size: 36px; font-weight: bold; }
  100. .Style11 {font-size: x-large; font-weight: bold; }
  101. -->
  102. </style>
  103. <!-- Fin script info bulle -->
  104.  
  105.  
  106. </head>
  107.  
  108. <!-- Info bulle -->
  109. <DIV ID="topdeck" CLASS="popper"> </DIV>
  110. <SCRIPT>
  111. var nav = (document.layers);
  112. var iex = (document.all);
  113. var skn = (nav) ? document.topdeck : topdeck.style;
  114. if (nav) document.captureEvents(Event.MOUSEMOVE);
  115. document.onmousemove = get_mouse;
  116.  
  117. function pop(msg,bak) {
  118. var content ="<TABLE WIDTH=130 BORDER=0 CELLPADDING=2 CELLSPACING=0 BGCOLOR=#000080><TR><TD><TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><CENTER><FONT COLOR=#FFFFFF SIZE=2><B></B></FONT></CENTER></TD></TR></TABLE><TABLE WIDTH=100% BORDER=0 CELLPADDING=2 CELLSPACING=0 BGCOLOR="+bak+"><TR><TD><FONT COLOR=#000000 SIZE=2><CENTER>"+msg+"</CENTER></FONT></TD></TR></TABLE></TD></TR></TABLE>";
  119. if (nav) {
  120. skn.document.write(content);
  121. skn.document.close();
  122. skn.visibility = "visible";
  123. }
  124. else if (iex)
  125. {
  126. document.all("topdeck").innerHTML = content;
  127. skn.visibility = "visible";
  128. }
  129. }
  130.  
  131. function get_mouse(e)
  132. {
  133. var x = (nav) ? e.pageX : event.x+document.body.scrollLeft;
  134. var y = (nav) ? e.pageY : event.y+document.body.scrollTop;
  135. skn.left = x - 60;
  136. skn.top = y+20;
  137. }
  138.  
  139. function kill()
  140. {
  141. skn.visibility = "hidden";
  142. }
  143. </SCRIPT>
  144. <!-- Fin script info bulle -->
  145. <table width="107%" border="0" cellspacing="0" cellpadding="0">
  146. <tr>
  147. <td width="100%"><font size="7" color="#000000"><b><font face="Old English Text MT" size="10">
  148. <div align="center" class="Style1">Echos - d'Aïn - Franin</div>
  149. </font></b></font><br>
  150. <span class="Style6">- Echos d'Aïn-Franin - page 5 -</span></td>
  151. </tr></table></div><br><br>
  152.  
  153.  
  154. <td><img src="diverses/separateur.gif" width="985" /><br /><br /></td></tr>
  155. <br />
  156.  
  157.  
  158. <table width="100%" border="2" cellpadding="0" cellspacing="0" bordercolor="#000000">
  159. <tr>
  160. <td width="100%" valign="top">
  161.  
  162. <div align="center"><span><span class="Style9">ASCENSION à NIMES- REPORTAGE PHOTOS</span></div></b><br><b><br><br>
  163.  
  164. <div align="center"><b><font size="5"><b>Départ de Toulon vers Nîmes- Courbessac</b><br><br> </font></b></div><br><br><br>
  165.  
  166.  
  167.  
  168. <a href="photos nimes/03.html"><img src="photos nimes/03_depart_toulon.jpg"name="03" width="459" height="383" border="0" /></a></a></a>
  169. <a href="photos nimes/04.html"><img src="photos nimes/04_pause_cafe.jpg" alt="" name="o4" width="323" height="454" border="0" id="o4"></a>
  170. </div>
  171. <br>
  172. <br><br>
  173.  
  174.  
  175. <div><a href="photos nimes/11.html"><img src="photos nimes/05avec_guy.jpg" alt="" name="o5" width="459" height="376" border="0" id="o5"></a><img src="photos nimes/06lesboutiques.jpg" alt="" name="o6" width="459" height="383" border="0" id="o6"><br>
  176. <img src="photos nimes/07_1992bougies.jpg" name="o7" width="432" height="397" id="o7"><a href="photos nimes/23bis.html"><img src="photos nimes/08lesbougies.jpg" alt="" name="o8" width="312" height="491" border="0" id="o8"></a><br>
  177. <img src="photos nimes/09lesbougies.jpg"><img src="photos nimes/09bougies2005.jpg" name="o9" width="459" height="385" id="o9"><img src="photos nimes/10vierge.jpg" alt="" name="o10" width="347" height="485" border="0" id="o10"><img src="photos nimes/11monteeprocession.jpg" alt="" name="o11" width="459" height="368" border="0" id="o11"><img src="photos nimes/12departprocession.jpg" alt="" name="o12" width="462" height="383" border="0" id="o12"><img src="photos nimes/13monteesouslesoleil.jpg" name="o13" width="459" height="384" id="o13"><img src="photos nimes/14montee.jpg" alt="" name="o14" border="0" id="o14"><img src="photos nimes/15montee.jpg" name="o15" id="o15"><img src="photos nimes/16grotte.jpg" alt="" name="o16" width="337" height="472" border="0" id="o16"><br>
  178. <img src="photos nimes/17plaqueVO.jpg" alt="" name="o17" width="454" height="369" border="0" id="o17"><img src="photos nimes/18plaquebachaga.jpg" alt="" name="o18" width="431" height="289" border="0" id="o18"><br>
  179. <img src="photos nimes/19plaquejouhaud.jpg" alt="" name="o19" width="454" height="329" border="0" id="o19"><img src="photos nimes/20plaquemdame.jpg" name="o20" width="500" height="625" border="0" id="o20"><br>
  180. <img src="photos nimes/21noseglises.jpg" alt="" name="o21" width="461" height="382" border="0" id="o21"><img src="photos nimes/22stantoine.jpg" alt="" name="o22" width="255" height="482" border="0" id="o22"><br>
  181. <img src="photos nimes/23staugustin.jpg" alt="" name="o23" width="207" height="511" border="0" id="o23"><img src="photos nimes/24viergemasacara.jpg" alt="" name="o24" width="460" height="766" border="0" id="o24"><img src="photos nimes/25tebernadette.jpg" alt="" name="o25" width="312" height="491" border="0" id="o25"><img src="photos nimes/26descente.jpg" name="p26" width="459" height="385" id="p26"></div>
  182. <br><br><br>
  183. <div align="center"><b><font size="5"><b>Carrefour de la Chapelle et des associations</b> </font></b></div><br><br><br>
  184.  
  185. <div><img src="photos nimes/29carrefour.jpg" name="o29" id="o29"><img src="photos nimes/30 mettre chapelle.jpg" name="o30" id="o30"><img src="photos nimes/31viergechapelle.jpg" name="o31" id="o31"><img src="photos nimes/32depotgerbe.jpg" name="o32" id="o32"><img src="photos nimes/33vitrail.jpg" name="o33" id="o33"><img src="photos nimes/34centreculturel.jpg" alt="" name="o34" width="459" height="385" border="0" id="o34"><a href="photos nimes/06.html">
  186.  
  187. <img src="photos nimes/35disparus.jpg" alt="" name="o35" width="459" height="385" border="0" id="o35"></a><img src="photos nimes/36echooranie.jpg" alt="" name="o36" width="459" height="385" border="0" id="o36"><img src="photos nimes/37cerclealgerianiste.jpg" alt="" name="o37" width="459" height="368" border="0" id="o37"><img src="photos nimes/38genealogie.jpg" alt="" name="o38" width="459" height="385" border="0" id="o38"><img src="photos nimes/39patricia.jpg" alt="" name="o39" width="500" height="375" border="0" id="o39"><img src="photos nimes/40Bousfer.jpg" alt="" name="o40" width="459" height="383" border="0" id="o40"><img src="photos nimes/41Planteurs.jpg" alt="" name="o41" width="462" height="377" border="0" id="o41"></div><br><br><br>
  188.  
  189.  
  190. <div align="center"><b><font size="5"><b>arrretter ici      Mes Amis et ma Famille</b><br><br> </font></b></div><br><br><br>
  191.  
  192. <div><img src="photos nimes/46 la releve.jpg" alt="" width="312" height="482" border="0"><img src="photos nimes/43-1 les anciens en 1982.jpg" alt="" width="429" height="447" border="0"> <img src="photos nimes/43 les anciens.jpg" alt="" width="425" height="369" border="0"> <img src="photos nimes/44 nouvelle generation2.jpg" alt="" width="435" height="354" border="0"> <img src="photos nimes/45 nouvelle generation1.jpg" alt="" width="449" height="397" border="0"> <img src="photos nimes/58 quatre generations.jpg" alt="" width="462" height="335" border="0"><br><br>
  193. <img src="photos nimes/54 sous la grele.jpg" alt="" width="462" height="341" border="0"><br><br><br>
  194.  
  195. <div align="center"><b><font size="5"><b>Rendez vous du Familia</b><br><br> </font></b></div><br><br>
  196. <img src="photos nimes/2008familia.jpg">
  197. <img src="photos nimes/2009lionel.jpg">
  198. <img src="photos nimes/2010familia.jpg"></div><br><br><br>
  199.  
  200. <div align="center"><b><font size="5"><b>Rendez vous des Visiteurs Oranais</b><br><br> </font></b></div><br><br><br>
  201.  
  202.  
  203. <div> <img src="photos nimes/16 grotte plaque.jpg" border="0" width="459" height="356" alt="">
  204. <img src="photos nimes/15 devant grotte.jpg" border="0" width="459" height="385" alt="">
  205. <img src="photos nimes/18 annie guy.jpg" alt="" width="459" height="368" border="0">
  206. <img src="photos nimes/17 amis.jpg" border="0" width="459" height="326" alt="">
  207. <img src="photos nimes/37 agapes3.jpg" alt="" width="459" height="368" border="0">
  208. <img src="photos nimes/38 gateaux.jpg" alt="" width="459" height="326" border="0">
  209. <img src="photos nimes/40 groupe.jpg" alt="" width="459" height="346" border="0"></div><br><br><br>
  210.  
  211.  
  212. <div align="center"><b><font size="5"><b>Le Marché "Persan"</b><br><br> </font></b></div><br><br><br>
  213.  
  214. <div><img src="photos nimes/59 charcuterie.jpg" alt="" width="312" height="491" border="0">
  215. <img src="photos nimes/60 gateaux .jpg" alt="" width="449" height="340" border="0"> <img src="photos nimes/61 ballons.jpg" alt="" width="462" height="368" border="0"><img src="photos nimes/62 danseuses.jpg" alt="" width="459" height="385" border="0"> <img src="photos nimes/63-2006le retour.jpg" alt="" width="425" height="369" border="0"></div><br><br><br>
  216.  
  217. <div align="center"><b><font size="5"><b>C'était à Oran avant 1962</b><br><br> </font></b></div><br><br><br>
  218.  
  219. <div><img src="photos nimes/53bis oran.jpg" alt="" width="459" height="328" border="0"></div><br><br> </td></tr></table>
  220.  
  221. <tr>
  222. <td align="center" valign="baseLine" nowrap bordercolor="#FFFFFF" bordercolorlight="#000000"> </td>
  223.  
  224. </td>
  225. </tr>
  226. </table>


SOURCE de l'image si elle s'affiche dans une autre fenêtre:

  1. <!-- Date de création: 16/05/2005 -->
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  4. <title>Nimes</title>
  5. <meta name="description" content="">
  6. <meta name="keywords" content="">
  7. <meta http-equiv="imagetoolbar" content="no">
  8.  
  9.  
  10.  
  11. <!-- Son de fond -->
  12. <bgsound src="../../Sons/i am the city journal.mid" loop="-1"></bgsound>
  13.  
  14.  
  15. <!-- Empecher le clic droit -->
  16. <SCRIPT LANGUAGE="JavaScript">
  17. function clicie() {
  18. // Fonction de détection pour Internet Explorer
  19. if ((event.button==2)||(event.button==3)) {
  20. alert("Respectez les droits d'auteur.");
  21. }
  22. }
  23. function clicns(e){
  24. // Fonction pour Netscape
  25. if(e.which==3){
  26. alert("Respectez les droits d'auteur.");
  27. return false;
  28. }
  29. }
  30.  
  31.  
  32. if (document.all) { document.onmousedown=clicie;}
  33. if (document.layers) {document.captureEvents(Event.MOUSEDOWN); document.onmousedown = clicns;}
  34. if (window.sidebar) {document.captureEvents(Event.MOUSEDOWN); document.onmousedown = clicns;}
  35. </SCRIPT>
  36.  
  37. <link rel="alternate" media="print" href="fete_print_doc.txt">
  38. <!-- Fin clic droit -->
  39.  
  40. <!-- Empecher selection texte -->
  41. <script type="text/javascript">
  42. <!-- debut
  43. function deselect(e)
  44. {return false;}
  45. function select()
  46. {return true;}
  47. document.onselectstart=new Function("return false");
  48. if (window.sidebar)
  49. {
  50. document.onmousedown=deselect;
  51. document.onclick=select;
  52. }
  53. // fin -->
  54. </script>
  55. <!-- fin empecher selection -->
  56.  
  57.  
  58. <!-- Grossissement image -->
  59. <script>
  60.  
  61. function expand() {
  62. if (smallslot.width<=550 + 150) {
  63. x=window.setTimeout('expand()', 200)
  64. smallslot.width=smallslot.width + 5
  65. smallslot.height=smallslot.height + 5
  66. }
  67. else {
  68. setTimeout('reduce()', 500)
  69. }
  70. }
  71.  
  72. function reduce() {
  73. if (smallslot.width>550) {
  74. x=window.setTimeout('reduce()', 500)
  75. smallslot.width=smallslot.width - 0
  76. smallslot.height=smallslot.height - 0
  77. }
  78. }
  79.  
  80. </script>
  81. <!-- Fin grossissement -->
  82.  
  83.  
  84. </head>
  85. <body background="../../Photos/Fonds de page/Journal.jpg" bgcolor="ffffff" text="000000" link="000080" vlink="800080" alink="ff0000" <br>
  86.  
  87. <div id="slot1" style="width:550;height:404" onmouseover=expand()>
  88. <br><br><br><br><div align="center"><a href="42.html"><IMG id="smallslot" src="42 Planteurs.jpg" border="0" width="250" height="203" alt="" align="middle"></a></div>
  89.  
  90. </div>
  91.  
  92. </body>
  93. </html>



VOILA UN TRES TRES GRAND MERCI A VOUS DEUX
MARIEOCEANE







m
0
l
a c 232 L Programmation
1 Septembre 2011 12:22:57

Alors, si tu veux la même chose que sur le site de bg62:
  • télécharge MultiBox: http://www.liamsmart.co.uk/Downloads/multiBox/multiBox....
  • extrais tous les dossiers (sauf le Files dont tu n'as pas besoin) dans ton répertoire
  • Ajoute ce code dans ta page HTML juste avant </head>:
    1. <link type="text/css" rel="stylesheet" href="./Styles/multiBox.css" />
    2. <!--[if lte IE 6]>
    3. <link type="text/css" rel="stylesheet" href="./Styles/multiBoxIE6.css" />
    4. <![endif]-->
    5.  
    6. <script type="text/javascript" src="./Scripts/mootools-1.2.4-core-yc.js"></script>
    7. <script type="text/javascript" src="./Scripts/mootools-1.2.4.4-more-yc.js"></script>
    8. <script type="text/javascript" src="./Scripts/overlay.js"></script>
    9.  
    10. <script type="text/javascript" src="./Scripts/multiBox.js"></script>
    11. <script type="text/javascript">
    12. window.addEvent('domready', function(){
    13. //call multiBox
    14. var initMultiBox = new multiBox({
    15. mbClass: '.mb',//class you need to add links that you want to trigger multiBox with (remember and update CSS files)
    16. container: $(document.body),//where to inject multiBox
    17. descClassName: 'multiBoxDesc',//the class name of the description divs
    18. path: './Files/',//path to mp3 and flv players
    19. useOverlay: true,//use a semi-transparent background. default: false;
    20. maxSize: {w:600, h:400},//max dimensions (width,height) - set to null to disable resizing
    21. addDownload: false,//do you want the files to be downloadable?
    22. pathToDownloadScript: './Scripts/forceDownload.asp',//if above is true, specify path to download script (classicASP and ASP.NET versions included)
    23. addRollover: true,//add rollover fade to each multibox link
    24. addOverlayIcon: true,//adds overlay icons to images within multibox links
    25. addChain: true,//cycle through all images fading them out then in
    26. recalcTop: true,//subtract the height of controls panel from top position
    27. addTips: false,//adds MooTools built in 'Tips' class to each element (see: http://mootools.net/docs/Plugins/Tips)
    28. autoOpen: 0//to auto open a multiBox element on page load change to (1, 2, or 3 etc)
    29. });
    30. });
    31. </script>

    Tu peux modifier quelques options (je t'en ai déjà modifié 2, j'ai supprimé le lien pour télécharger, et j'ai supprimé le tips qui apparait quand tu passes sur une image)
  • Ensuite pour chacune de tes liens vers les images tu ajoutes:
    1. class="mb" rel="[images],noDesc"

    De manière à ce que tu aies quelque chose comme ça :
    <a href="photos nimes/03_depart_toulon.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/03_depart_toulon.jpg" name="03" width="459" height="383" border="0" /></a>

    Et donc en faisant ça pour toutes tes images, ça devrait être bon. (par contre, il faut que le href soit l'image il me semble et pas une page html comme tu as fait)
    Et tu peux déjà tester sur une image pour voir ce que ça donne.
    m
    0
    l
    1 Septembre 2011 15:40:31

    faudrait voir ce que ça donne en ligne .... :hello: 
    m
    0
    l
    1 Septembre 2011 19:38:04

    OmaR a dit :
    Alors, si tu veux la même chose que sur le site de bg62:
  • télécharge MultiBox: http://www.liamsmart.co.uk/Downloads/multiBox/multiBox....
  • extrais tous les dossiers (sauf le Files dont tu n'as pas besoin) dans ton répertoire
  • Ajoute ce code dans ta page HTML juste avant </head>:
    1. <link type="text/css" rel="stylesheet" href="./Styles/multiBox.css" />
    2. <!--[if lte IE 6]>
    3. <link type="text/css" rel="stylesheet" href="./Styles/multiBoxIE6.css" />
    4. <![endif]-->
    5.  
    6. <script type="text/javascript" src="./Scripts/mootools-1.2.4-core-yc.js"></script>
    7. <script type="text/javascript" src="./Scripts/mootools-1.2.4.4-more-yc.js"></script>
    8. <script type="text/javascript" src="./Scripts/overlay.js"></script>
    9.  
    10. <script type="text/javascript" src="./Scripts/multiBox.js"></script>
    11. <script type="text/javascript">
    12. window.addEvent('domready', function(){
    13. //call multiBox
    14. var initMultiBox = new multiBox({
    15. mbClass: '.mb',//class you need to add links that you want to trigger multiBox with (remember and update CSS files)
    16. container: $(document.body),//where to inject multiBox
    17. descClassName: 'multiBoxDesc',//the class name of the description divs
    18. path: './Files/',//path to mp3 and flv players
    19. useOverlay: true,//use a semi-transparent background. default: false;
    20. maxSize: {w:600, h:400},//max dimensions (width,height) - set to null to disable resizing
    21. addDownload: false,//do you want the files to be downloadable?
    22. pathToDownloadScript: './Scripts/forceDownload.asp',//if above is true, specify path to download script (classicASP and ASP.NET versions included)
    23. addRollover: true,//add rollover fade to each multibox link
    24. addOverlayIcon: true,//adds overlay icons to images within multibox links
    25. addChain: true,//cycle through all images fading them out then in
    26. recalcTop: true,//subtract the height of controls panel from top position
    27. addTips: false,//adds MooTools built in 'Tips' class to each element (see: http://mootools.net/docs/Plugins/Tips)
    28. autoOpen: 0//to auto open a multiBox element on page load change to (1, 2, or 3 etc)
    29. });
    30. });
    31. </script>

    Tu peux modifier quelques options (je t'en ai déjà modifié 2, j'ai supprimé le lien pour télécharger, et j'ai supprimé le tips qui apparait quand tu passes sur une image)
  • Ensuite pour chacune de tes liens vers les images tu ajoutes:
    1. class="mb" rel="[images],noDesc"

    De manière à ce que tu aies quelque chose comme ça :
    <a href="photos nimes/03_depart_toulon.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/03_depart_toulon.jpg" name="03" width="459" height="383" border="0" /></a>

    Et donc en faisant ça pour toutes tes images, ça devrait être bon. (par contre, il faut que le href soit l'image il me semble et pas une page html comme tu as fait)
    Et tu peux déjà tester sur une image pour voir ce que ça donne.







  • OMAR ET BG2
    Omar tu travaille à une vitesse, je n'en reviens, demain j'essaierai voir si j'ai compris le dossier répertoire c'est celui où j'ai les formulaires et le livre d'or, je vais essayer et je vous tiens au courant, en attendant un grand grand merci, j'apprécie sérieusement cette entraide
    à dès que j'ai fait, je vous en parle MERCI!!!!!! Marieoceane
    m
    0
    l
    6 Septembre 2011 15:34:24

    OmaR a dit :
    Alors, si tu veux la même chose que sur le site de bg62:
  • télécharge MultiBox: http://www.liamsmart.co.uk/Downloads/multiBox/multiBox....
  • extrais tous les dossiers (sauf le Files dont tu n'as pas besoin) dans ton répertoire
  • Ajoute ce code dans ta page HTML juste avant </head>:
    1. <link type="text/css" rel="stylesheet" href="./Styles/multiBox.css" />
    2. <!--[if lte IE 6]>
    3. <link type="text/css" rel="stylesheet" href="./Styles/multiBoxIE6.css" />
    4. <![endif]-->
    5.  
    6. <script type="text/javascript" src="./Scripts/mootools-1.2.4-core-yc.js"></script>
    7. <script type="text/javascript" src="./Scripts/mootools-1.2.4.4-more-yc.js"></script>
    8. <script type="text/javascript" src="./Scripts/overlay.js"></script>
    9.  
    10. <script type="text/javascript" src="./Scripts/multiBox.js"></script>
    11. <script type="text/javascript">
    12. window.addEvent('domready', function(){
    13. //call multiBox
    14. var initMultiBox = new multiBox({
    15. mbClass: '.mb',//class you need to add links that you want to trigger multiBox with (remember and update CSS files)
    16. container: $(document.body),//where to inject multiBox
    17. descClassName: 'multiBoxDesc',//the class name of the description divs
    18. path: './Files/',//path to mp3 and flv players
    19. useOverlay: true,//use a semi-transparent background. default: false;
    20. maxSize: {w:600, h:400},//max dimensions (width,height) - set to null to disable resizing
    21. addDownload: false,//do you want the files to be downloadable?
    22. pathToDownloadScript: './Scripts/forceDownload.asp',//if above is true, specify path to download script (classicASP and ASP.NET versions included)
    23. addRollover: true,//add rollover fade to each multibox link
    24. addOverlayIcon: true,//adds overlay icons to images within multibox links
    25. addChain: true,//cycle through all images fading them out then in
    26. recalcTop: true,//subtract the height of controls panel from top position
    27. addTips: false,//adds MooTools built in 'Tips' class to each element (see: http://mootools.net/docs/Plugins/Tips)
    28. autoOpen: 0//to auto open a multiBox element on page load change to (1, 2, or 3 etc)
    29. });
    30. });
    31. </script>

    Tu peux modifier quelques options (je t'en ai déjà modifié 2, j'ai supprimé le lien pour télécharger, et j'ai supprimé le tips qui apparait quand tu passes sur une image)
  • Ensuite pour chacune de tes liens vers les images tu ajoutes:
    1. class="mb" rel="[images],noDesc"

    De manière à ce que tu aies quelque chose comme ça :
    <a href="photos nimes/03_depart_toulon.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/03_depart_toulon.jpg" name="03" width="459" height="383" border="0" /></a>

    Et donc en faisant ça pour toutes tes images, ça devrait être bon. (par contre, il faut que le href soit l'image il me semble et pas une page html comme tu as fait)
    Et tu peux déjà tester sur une image pour voir ce que ça donne.





  • BONJOUR OMAR, j'ai eu peur que tu ne ferme le sujet Voilà j'ai testé avec ton code, cela fontionne, seule chose les images ne se ferment pas, j'ai donc aussi testé avec le code du logiciel que tu m'as dit de telecharger, une 1ere chose il faudrait agrandir le container, je n'ai pas su, et d'autre part tout fonctionne, seul souci pour les photos,certaines se téléchargent, d'autres non, j'ai essayé avec 4 photos, si tu veux je t'envoies la source de chaque essai, je n'ai pas osé de peur de surcharger le forum, peux tu stp me dire ce que tu préfères? merci infiniment pour ton aide, vraiment merci à bG2 aussi
    Marieoceane :hello: 
    m
    0
    l
    a c 232 L Programmation
    6 Septembre 2011 16:12:03

    Je ne ferme que très rarement les sujets, sauf quand ceux-ci n'ont rien à faire sur le forum.

    Pour agrandir la taille des images, il faut modifier la ligne 20 du code que je t'ai donné, le 600 représente la largeur et le 400 la hauteur des images.

    Et tu peux mettre le code des 4 images (seulement le code, tu mets le <a href...><img src... /></a> de tes 4 images) et je regarde ce qui ne va pas.
    Ca serait bien si tu pouvais mettre aussi ton code sur internet. Comme ça j'ai les images directement, et je peux voir ce qui cloche dans ta configuration.
    m
    0
    l
    6 Septembre 2011 17:48:59

    OmaR a dit :
    Je ne ferme que très rarement les sujets, sauf quand ceux-ci n'ont rien à faire sur le forum.

    Pour agrandir la taille des images, il faut modifier la ligne 20 du code que je t'ai donné, le 600 représente la largeur et le 400 la hauteur des images.

    Et tu peux mettre le code des 4 images (seulement le code, tu mets le <a href...><img src... /></a> de tes 4 images) et je regarde ce qui ne va pas.
    Ca serait bien si tu pouvais mettre aussi ton code sur internet. Comme ça j'ai les images directement, et je peux voir ce qui cloche dans ta configuration.



    Omar je t'envoie dans un 1e temps le code avec 4 images, d'après le code que tu m'as donné, tu verras bien sur tu n'auras que l'emplacement des images, ce n'est pas grave, en cliquant sur une image elle s'affiche plus grande, les dimensions sont bonnes, mais le fond reste blanc dommage pour l'esthétique, mais on ne peut fermer la grande image, ensuite si tu veux je t'enverrais l'exemple avec le fichier idex du logiciel, merci Omar



    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Document sans nom</title><style type="text/css">
    <!--
    body {
    background-image: url(../Photos/fonds_de_page/fondjournal.jpg);
    }
    -->
    </style>
    Code :

    1. <link type="text/css" rel="stylesheet" href="./Styles/multiBox.css" />
    2. <!--[if lte IE 6]>
    3. <link type="text/css" rel="stylesheet" href="./Styles/multiBoxIE6.css" />
    4. <![endif]-->
    5.
    6. <script type="text/javascript" src="./Scripts/mootools-1.2.4-core-yc.js"></script>
    7. <script type="text/javascript" src="./Scripts/mootools-1.2.4.4-more-yc.js"></script>
    8. <script type="text/javascript" src="./Scripts/overlay.js"></script>
    9.
    10. <script type="text/javascript" src="./Scripts/multiBox.js"></script>
    11. <script type="text/javascript">
    12. window.addEvent('domready', function(){
    13. //call multiBox
    14. var initMultiBox = new multiBox({
    15. mbClass: '.mb',//class you need to add links that you want to trigger multiBox with (remember and update CSS files)
    16. container: $(document.body),//where to inject multiBox
    17. descClassName: 'multiBoxDesc',//the class name of the description divs
    18. path: './Files/',//path to mp3 and flv players
    19. useOverlay: true,//use a semi-transparent background. default: false;
    20. maxSize: {w:600, h:400},//max dimensions (width,height) - set to null to disable resizing
    21. addDownload: false,//do you want the files to be downloadable?
    22. pathToDownloadScript: './Scripts/forceDownload.asp',//if above is true, specify path to download script (classicASP and ASP.NET versions included)
    23. addRollover: true,//add rollover fade to each multibox link
    24. addOverlayIcon: true,//adds overlay icons to images within multibox links
    25. addChain: true,//cycle through all images fading them out then in
    26. recalcTop: true,//subtract the height of controls panel from top position
    27. addTips: false,//adds MooTools built in 'Tips' class to each element (see: http://mootools.net/docs/Plugins/Tips)
    28. autoOpen: 0//to auto open a multiBox element on page load change to (1, 2, or 3 etc)
    29. });
    30. });
    31. </script>




    </head>

    <body>
    <a href="photos nimes/03_depart_toulon.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/03_depart_toulon1.jpg" name="03" width="230" height="192" border="0" /></a>


    <a href="photos nimes/04_pause_cafe.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/04_pause_cafe1.jpg" name="03" width="162" height="227" border="0" /></a>


    <a href="photos nimes/62gateaux.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/62gateaux1.jpg" name="03" width="224" height="170" border="0" /></a>


    <a href="photos nimes/60ballons.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/60ballons1.jpg" name="03" width="231" height="184" border="0" /></a>






    </body>
    </html>
    m
    0
    l
    a c 232 L Programmation
    6 Septembre 2011 18:48:04

    Il ne faut pas copier les numéros de ligne de code !!
    En double cliquant sur la partie "code", tu peux enlever les numéros de lignes pour copier le tout.

    En ayant ça :
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    2. <html>
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    5. <title>Document sans nom</title>
    6. <style type="text/css">
    7. <!--
    8. body {
    9. background-image: url(../Photos/fonds_de_page/fondjournal.jpg);
    10. }
    11. -->
    12. </style>
    13.  
    14. <link type="text/css" rel="stylesheet" href="./Styles/multiBox.css" />
    15. <!--[if lte IE 6]>
    16. <link type="text/css" rel="stylesheet" href="./Styles/multiBoxIE6.css" />
    17. <![endif]-->
    18.  
    19. <script type="text/javascript" src="./Scripts/mootools-1.2.4-core-yc.js"></script>
    20. <script type="text/javascript" src="./Scripts/mootools-1.2.4.4-more-yc.js"></script>
    21. <script type="text/javascript" src="./Scripts/overlay.js"></script>
    22.  
    23. <script type="text/javascript" src="./Scripts/multiBox.js"></script>
    24. <script type="text/javascript">
    25. window.addEvent('domready', function(){
    26. //call multiBox
    27. var initMultiBox = new multiBox({
    28. mbClass: '.mb',//class you need to add links that you want to trigger multiBox with (remember and update CSS files)
    29. container: $(document.body),//where to inject multiBox
    30. descClassName: 'multiBoxDesc',//the class name of the description divs
    31. path: './Files/',//path to mp3 and flv players
    32. useOverlay: true,//use a semi-transparent background. default: false;
    33. maxSize: {w:600, h:400},//max dimensions (width,height) - set to null to disable resizing
    34. addDownload: false,//do you want the files to be downloadable?
    35. pathToDownloadScript: './Scripts/forceDownload.asp',//if above is true, specify path to download script (classicASP and ASP.NET versions included)
    36. addRollover: true,//add rollover fade to each multibox link
    37. addOverlayIcon: true,//adds overlay icons to images within multibox links
    38. addChain: true,//cycle through all images fading them out then in
    39. recalcTop: true,//subtract the height of controls panel from top position
    40. addTips: false,//adds MooTools built in 'Tips' class to each element (see: http://mootools.net/docs/Plugins/Tips)
    41. autoOpen: 0//to auto open a multiBox element on page load change to (1, 2, or 3 etc)
    42. });
    43. });
    44. </script>
    45. </head>
    46. <body>
    47.  
    48.  
    49. <a href="photos nimes/03_depart_toulon.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/03_depart_toulon1.jpg" name="03" width="230" height="192" border="0" /></a>
    50.  
    51.  
    52. <a href="photos nimes/04_pause_cafe.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/04_pause_cafe1.jpg" name="03" width="162" height="227" border="0" /></a>
    53.  
    54.  
    55. <a href="photos nimes/62gateaux.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/62gateaux1.jpg" name="03" width="224" height="170" border="0" /></a>
    56.  
    57.  
    58. <a href="photos nimes/60ballons.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/60ballons1.jpg" name="03" width="231" height="184" border="0" /></a>
    59.  
    60.  
    61. </body>
    62. </html>


    Tout devrait marcher ! (Double clique sur la partie code, ça va enlever tous les numéros de ligne, et tu pourras copier le contenu, il ne faut pas non plus copier le premier "Code :" en gras)
    m
    0
    l
    6 Septembre 2011 18:57:33

    OmaR a dit :
    Il ne faut pas copier les numéros de ligne de code !!
    En double cliquant sur la partie "code", tu peux enlever les numéros de lignes pour copier le tout.

    En ayant ça :
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    2. <html>
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    5. <title>Document sans nom</title>
    6. <style type="text/css">
    7. <!--
    8. body {
    9. background-image: url(../Photos/fonds_de_page/fondjournal.jpg);
    10. }
    11. -->
    12. </style>
    13.  
    14. <link type="text/css" rel="stylesheet" href="./Styles/multiBox.css" />
    15. <!--[if lte IE 6]>
    16. <link type="text/css" rel="stylesheet" href="./Styles/multiBoxIE6.css" />
    17. <![endif]-->
    18.  
    19. <script type="text/javascript" src="./Scripts/mootools-1.2.4-core-yc.js"></script>
    20. <script type="text/javascript" src="./Scripts/mootools-1.2.4.4-more-yc.js"></script>
    21. <script type="text/javascript" src="./Scripts/overlay.js"></script>
    22.  
    23. <script type="text/javascript" src="./Scripts/multiBox.js"></script>
    24. <script type="text/javascript">
    25. window.addEvent('domready', function(){
    26. //call multiBox
    27. var initMultiBox = new multiBox({
    28. mbClass: '.mb',//class you need to add links that you want to trigger multiBox with (remember and update CSS files)
    29. container: $(document.body),//where to inject multiBox
    30. descClassName: 'multiBoxDesc',//the class name of the description divs
    31. path: './Files/',//path to mp3 and flv players
    32. useOverlay: true,//use a semi-transparent background. default: false;
    33. maxSize: {w:600, h:400},//max dimensions (width,height) - set to null to disable resizing
    34. addDownload: false,//do you want the files to be downloadable?
    35. pathToDownloadScript: './Scripts/forceDownload.asp',//if above is true, specify path to download script (classicASP and ASP.NET versions included)
    36. addRollover: true,//add rollover fade to each multibox link
    37. addOverlayIcon: true,//adds overlay icons to images within multibox links
    38. addChain: true,//cycle through all images fading them out then in
    39. recalcTop: true,//subtract the height of controls panel from top position
    40. addTips: false,//adds MooTools built in 'Tips' class to each element (see: http://mootools.net/docs/Plugins/Tips)
    41. autoOpen: 0//to auto open a multiBox element on page load change to (1, 2, or 3 etc)
    42. });
    43. });
    44. </script>
    45. </head>
    46. <body>
    47.  
    48.  
    49. <a href="photos nimes/03_depart_toulon.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/03_depart_toulon1.jpg" name="03" width="230" height="192" border="0" /></a>
    50.  
    51.  
    52. <a href="photos nimes/04_pause_cafe.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/04_pause_cafe1.jpg" name="03" width="162" height="227" border="0" /></a>
    53.  
    54.  
    55. <a href="photos nimes/62gateaux.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/62gateaux1.jpg" name="03" width="224" height="170" border="0" /></a>
    56.  
    57.  
    58. <a href="photos nimes/60ballons.jpg" class="mb" rel="[images],noDesc"><img src="photos nimes/60ballons1.jpg" name="03" width="231" height="184" border="0" /></a>
    59.  
    60.  
    61. </body>
    62. </html>


    Tout devrait marcher ! (Double clique sur la partie code, ça va enlever tous les numéros de ligne, et tu pourras copier le contenu, il ne faut pas non plus copier le premier "Code :" en gras)



    Effectivement Omar mais helas il y a dessous les photos le telechargement comment faire pour le supprimer? encore merci tu es vraiment gentil
    Marieoceane
    m
    0
    l
    6 Septembre 2011 19:02:28

    OMAR, je suis désolée j'ai regardé trop vite, non pas de téléchargement tout fonctionne parfaitement, comment te remercier? c'est vraiment très très gentil un grand merci à toi
    Marieoceane :hello: 
    m
    0
    l
    Tom's guide dans le monde
    • Allemagne
    • Italie
    • Irlande
    • Royaume Uni
    • Etats Unis
    Suivre Tom's Guide
    Inscrivez-vous à la Newsletter
    • ajouter à twitter
    • ajouter à facebook
    • ajouter un flux RSS