Modifications pour le document Code test
sur 2021/11/02 22:00
sur 2021/11/23 20:57
Résumé
Détails
- Propriétés de la Page
-
- Contenu
-
... ... @@ -1,190 +1,191 @@ 1 1 2 +{{html}} 3 +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 4 +<html> 5 +<head> 6 +<title>Menu déroulant en Javascript</title> 7 +<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> 8 + 9 +<script type="text/javascript"> 10 +<!-- 11 +window.onload=montre; 12 +function montre(id) 13 + { 14 + var d = document.getElementById(id); 15 + for (var i = 1; i<=10; i++) 16 + { 17 + if (document.getElementById('smenu'+i)) 18 + {document.getElementById('smenu'+i).style.display='none';} 19 + } 20 + if (d) 21 + {d.style.display='block';} 22 + } 23 +//--> 24 +</script> 25 + 26 + 27 +<style type="text/css"> 28 +<!-- 29 +/* CSS issu des tutoriels http://css.alsacreations.com */ 30 +body { 31 +margin: 0; 32 +padding: 0; 33 +background: white; 34 +font: 80% verdana, arial, sans-serif; 35 +} 36 +dl, dt, dd, ul, li { 37 +margin: 0; 38 +padding: 0; 39 +list-style-type: none; 40 +} 41 +#menu { 42 +position: absolute; 43 +top=; 44 +bottom:80%; 45 +left: 0px; 46 +z-index:100px; 47 +width: 100%; 48 +} 49 +#menu dl { 50 +float: left; 51 +width: 12em; 52 +position: relative; 53 +margin: 0 2px; 54 +} 55 +#menu dt { 56 +cursor: pointer; 57 +text-align: center; 58 +font-weight: bold; 59 +background: #ccc; 60 +border: 1px solid gray; 61 + 62 +} 63 +#menu dd { 64 +background-color: #ccc; 65 +position: absolute; 66 +bottom:1.5em; 67 +width:100%; 68 +} 69 +#menu li { 70 +text-align: center; 71 +} 72 +#menu li a, #menu dt a { 73 +color: #000; 74 +text-decoration: none; 75 +display: block; 76 +height: 100%; 77 +border: 0 none; 78 +} 79 +#menu li a:hover, #menu dt a:hover { 80 +background: #eee; 81 +} 82 + 83 +#site { 84 +position: absolute; 85 +z-index: 1; 86 +top : 70px; 87 +left : 10px; 88 +color: #000; 89 +background-color: #ddd; 90 +padding: 5px; 91 +border: 1px solid gray; 92 +} 93 + 94 +a {text-decoration: none; 95 +color: black; 96 +color: #222; 97 +} 98 +--> 99 +</style> 100 +</head> 101 + 102 +<body > 103 + 104 +<div id="menu" > 105 +<dl> 106 +<dt onmouseover="javascript:montre();"><a href="#" title="Retour à l'accueil">Accueil</a></dt> 107 +</dl> 108 + 109 +<dl> 110 +<dt onmouseover="menuDeroulant('smenu1');" >Menu 1</dt> // faire apparaitre smenu1 passage de la souris 111 +<dd id="smenu1" style="display:none;" > // ne pas l'afficher 112 +<ul > 113 +<li><a href="#">Sous-Menu 1.1</a></li> 114 + 115 +<li><a href="#">Sous-Menu 1.2</a></li> 116 +<li><a href="#">Sous-Menu 1.3</a></li> 117 +<li><a href="#">Sous-Menu 1.4</a></li> 118 +<li><a href="#">Sous-Menu 1.5</a></li> 119 +<li><a href="#">Sous-Menu 1.6</a></li> 120 +</ul> 121 + 122 +</dd> 123 +</dl><dl> 124 +<dt onmouseover="menuDeroulant('smenu1');" >Menu 1</dt> 2 2 3 -{{html clean="false"}} 4 -<div id="box vert" style="border: solid green; display: flex;"> 5 - <div id="html"> 6 - <body> 7 - <div id=blue_box style="display:flex; border:blue dotted;; padding-left:1em;"> 8 - <div id="paragraphe" style="display:flex; color:blue;"> 9 - <p> 10 - <div> 11 - <h3 style="display:flex;border: solid mediumpurple;">Dates de la rentrée 2021:</h3> 12 - <ul style="border: solid black;"> 13 - <li>11/9: réunion</li> 14 - <li>25-26/9: Week-end de groupe de rentrée à Mackviller (tous)</li> 15 - <li>2 oct: réunion</li> 16 - <li>16-17/10: rouges & bleus: week-end du JOTI:</li> 17 - <li>30/10: oranges: réunion</li> 18 - <li>6/11: réunion</li> 19 - <li>20/11: réunion (rouges & bleus: week-end)</li> 20 - <li>4/12: réunion</li> 21 - <li>11/12: réunion</li> 22 - </ul> 23 - </p> 24 - <p style="display:flex; border: dotted red; "> <br> 25 - **Note:** la fête de Noël est repoussée au temps du carnaval. 26 - 27 - Les programmes par branche: **[[Verts>>Verts.WebHome]], [[Rouges>>Rouges.WebHome]], [[Bleus>>doc:Bleus.WebHome]], [[Oranges>>doc:Oranges.WebHome]].** 28 - Les **[[anciens plannings>>doc:Groupe.ArchivePlannings]].** 29 - 30 - Les réunions ont lieu à Forbach au **[[local Rue de Remsing>>Local]]**, en général, de 14h00 à 17h30 (des changements covidéens ne sont pas rares). 31 - 32 - Des covoiturages entre Welfedering et Forbach sont régulièrement organisés par le biais d'un sondage Scoodle dont l'URL est envoyé par mail. 33 - </p> 34 - </div> 35 - </div> 36 - </div> 37 - </body> 38 - </div> 39 - <div id="carrouselle_photo" style="display:flex;"> 40 - <div id="box rouge" style="border:solid red"> 41 - <div style="height:310px; width:300px; padding-left:1em; float:right"> 42 - <div id="slideshow1" class="slide" style=""><div><img src="/xwiki/bin/download/Main/WebHome/pionniers-veillee-2020.jpeg?width=450"></div></div> 43 - <div id="slideshow2" class="slide" style="display: none"><div><img src="/xwiki/bin/download/Main/WebHome/timothee-technique-de-feu-5.jpeg?width=450"></div></div> 44 - <div id="slideshow3" class="slide" style="display: none"><div><img src="/xwiki/bin/download/Main/WebHome/DSCN5058.JPG?width=450"></div></div> 45 - <div id="slideshow4" class="slide" style="display: none"><div><img src="/xwiki/bin/download/Main/WebHome/P1220426.JPG?width=450"></div></div> 46 - <div id="slideshow5" class="slide" style="display: none"><div><img src="/xwiki/bin/download/Rouges/WebHome/Les-pios-preparent.jpg?width=450"></div></div> 47 - <div id="slideshow6" class="slide" style="display:none"> <div><img src="/xwiki/bin/download/Main/WebHome/paul-casserolle-sur-le-feu.JPG?width=450"></div></div> 48 - </div> 49 - </div> 50 - <div id="Javascript"> 51 - <script type="text/javascript"> 52 - 53 - start_slideshow(1, 6, 3000); 54 - 55 - function start_slideshow(start_frame, end_frame, delay) { 56 - setTimeout(switch_slides(start_frame,start_frame,end_frame, delay), delay); 57 - } 58 - 59 - function switch_slides(frame, start_frame, end_frame, delay) { 60 - return (function() { 61 - Effect.Fade('slideshow' + frame); 62 - frame = Math.floor(Math.random()*(end_frame-start_frame+1))+start_frame; 63 - //if(console) console.log("Next photo: " + frame); 64 - setTimeout("Effect.Appear('slideshow" + frame + "');", 850); 65 - setTimeout(switch_slides(frame, start_frame, end_frame, delay), delay + 850); 66 - }) 67 - } 68 - 69 - var isGood = document.location.href.startsWith("https://"); 70 - var isWrong = document.location.href.startsWith("http://"); 71 - console.log("Insisting? " + isGood + " " + isWrong); 72 - if(!isGood && isWrong) { 73 - if(console && console.log) console.log("Redirecting to the https side."); 74 - document.location.replace("https://" + document.location.href.substring("http://".length)); 75 - } 76 - </script> 77 - </div> 78 - </div> 126 +<dd id="smenu1" style="display:none;" > // ne pas l'afficher 127 +<ul > 128 +<li><a href="#">Sous-Menu 1.1</a></li> 129 + 130 +<li><a href="#">Sous-Menu 1.2</a></li> 131 +<li><a href="#">Sous-Menu 1.3</a></li> 132 +<li><a href="#">Sous-Menu 1.4</a></li> 133 +<li><a href="#">Sous-Menu 1.5</a></li> 134 +<li><a href="#">Sous-Menu 1.6</a></li> 135 +</ul> 136 + 137 +</dd> 138 +</dl> 139 + 140 + 141 +<dl> 142 +<dt onmouseover="javascript:montre('smenu2');">Menu 2</dt> 143 +<dd id="smenu2"> 144 +<ul> 145 +<li><a href="#">Sous-Menu 2.1</a></li> 146 +<li><a href="#">Sous-Menu 2.2</a></li> 147 + 148 +<li><a href="#">Sous-Menu 2.3</a></li> 149 +<li><a href="#">Sous-Menu 2.4</a></li> 150 +</ul> 151 +</dd> 152 +</dl> 153 + 154 +<dl> 155 +<dt onmouseover="javascript:montre('smenu3');">Menu 3</dt> 156 + 157 +<dd id="smenu3"> 158 + 159 +<ul> 160 +<li><a href="#">Sous-Menu 3.1</a></li> 161 +<li><a href="#">Sous-Menu 3.2</a></li> 162 +<li><a href="#">Sous-Menu 3.3</a></li> 163 +<li><a href="#">Sous-Menu 3.4</a></li> 164 + 165 +<li><a href="#">Sous-Menu 3.5</a></li> 166 + 167 +</ul> 168 +</dd> 169 +</dl> 170 + 171 +<dl> 172 +<dt onmouseover="javascript:montre('smenu4');">Menu 4</dt> 173 +<dd id="smenu4"> 174 +<ul> 175 + 176 +<li><a href="#">Sous-Menu 4.1</a></li> 177 + 178 +<li><a href="#">Sous-Menu 4.2</a></li> 179 +<li><a href="#">Sous-Menu 4.3</a></li> 180 +</ul> 181 +</dd> 182 +</dl> 183 + 184 + 79 79 </div> 186 + 187 + 188 +</body> 189 +</html> 80 80 {{/html}} 81 81 82 -(% id="blue_box" style="display:flex; border:blue dotted;; padding-left:1em;" %) 83 -((( 84 -(% id="paragraphe" style="display:flex; color:blue;" %) 85 -((( 86 - 87 - 88 -((( 89 -(% style="display:flex;border: solid mediumpurple;" %) 90 -=== Dates de la rentrée 2021: === 91 - 92 -(% style="border:solid black" %) 93 -* 11/9: réunion 94 -* 25-26/9: Week-end de groupe de rentrée à Mackviller (tous) 95 -* 2 oct: réunion 96 -* 16-17/10: rouges & bleus: week-end du JOTI: 97 -* 30/10: oranges: réunion 98 -* 6/11: réunion 99 -* 20/11: réunion (rouges & bleus: week-end) 100 -* 4/12: réunion 101 -* 11/12: réunion 102 - 103 - 104 -(% style="display:flex; border: dotted red;" %) 105 - 106 -~*~*Note:~*~* la fête de Noël est repoussée au temps du carnaval. Les programmes par branche: ~*~*~[~[Verts>>Verts.WebHome]], ~[~[Rouges>>Rouges.WebHome]], ~[~[Bleus>>doc:Bleus.WebHome]], ~[~[Oranges>>doc:Oranges.WebHome]].~*~* Les ~*~*~[~[anciens plannings>>doc:Groupe.ArchivePlannings]].~*~* Les réunions ont lieu à Forbach au ~*~*~[~[local Rue de Remsing>>Local]]~*~*, en général, de 14h00 à 17h30 (des changements covidéens ne sont pas rares). Des covoiturages entre Welfedering et Forbach sont régulièrement organisés par le biais d'un sondage Scoodle dont l'URL est envoyé par mail. 107 -))) 108 -))) 109 -))) 110 - 111 -(% id="carrouselle_photo" style="display:flex;" %) 112 -((( 113 -(% id="box rouge" style="border:solid red" %) 114 -((( 115 -(% style="height:310px; width:300px; padding-left:1em; float:right" %) 116 -((( 117 -(% class="slide" id="slideshow1" %) 118 -((( 119 -((( 120 -[[image:/xwiki/bin/download/Main/WebHome/pionniers-veillee-2020.jpeg?width=450]] 121 -))) 122 -))) 123 - 124 -(% class="slide" id="slideshow2" style="display: none" %) 125 -((( 126 -((( 127 -[[image:/xwiki/bin/download/Main/WebHome/timothee-technique-de-feu-5.jpeg?width=450]] 128 -))) 129 -))) 130 - 131 -(% class="slide" id="slideshow3" style="display: none" %) 132 -((( 133 -((( 134 -[[image:/xwiki/bin/download/Main/WebHome/DSCN5058.JPG?width=450]] 135 -))) 136 -))) 137 - 138 -(% class="slide" id="slideshow4" style="display: none" %) 139 -((( 140 -((( 141 -[[image:/xwiki/bin/download/Main/WebHome/P1220426.JPG?width=450]] 142 -))) 143 -))) 144 - 145 -(% class="slide" id="slideshow5" style="display: none" %) 146 -((( 147 -((( 148 -[[image:/xwiki/bin/download/Rouges/WebHome/Les-pios-preparent.jpg?width=450]] 149 -))) 150 -))) 151 - 152 -(% class="slide" id="slideshow6" style="display:none" %) 153 -((( 154 -((( 155 -[[image:/xwiki/bin/download/Main/WebHome/paul-casserolle-sur-le-feu.JPG?width=450]] 156 -))) 157 -))) 158 -))) 159 -))) 160 - 161 -(% id="Javascript" %) 162 -((( 163 -/~*~*/ 164 -\\ 165 - start_slideshow(1, 6, 3000); 166 - 167 - function start_slideshow(start_frame, end_frame, delay) { 168 - setTimeout(switch_slides(start_frame,start_frame,end_frame, delay), delay); 169 - } 170 - 171 - function switch_slides(frame, start_frame, end_frame, delay) { 172 - return (function() { 173 - Effect.Fade('slideshow' + frame); 174 - frame = Math.floor(Math.random()*(end_frame-start_frame+1))+start_frame; 175 - ~/~/if(console) console.log("Next photo: " + frame); 176 - setTimeout("Effect.Appear('slideshow" + frame + "');", 850); 177 - setTimeout(switch_slides(frame, start_frame, end_frame, delay), delay + 850); 178 - }) 179 - } 180 -\\ var isGood = document.location.href.startsWith("https:~/~/"); 181 - var isWrong = document.location.href.startsWith("http:~/~/"); 182 - console.log("Insisting? " + isGood + " " + isWrong); 183 - if(!isGood && isWrong) { 184 - if(console && console.log) console.log("Redirecting to the https side."); 185 - document.location.replace("https:~/~/" + document.location.href.substring("http:~/~/".length)); 186 - } 187 - 188 -/~*~*/ 189 -))) 190 -)))