Modifications pour le document Code test
sur 2021/11/23 20:57
sur 2021/11/23 09:02
Résumé
Détails
- Propriétés de la Page
-
- Contenu
-
... ... @@ -1,191 +1,42 @@ 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';} 2 +{{html clean="false"}} 3 + 4 + <div style="height:310px; width:300px; padding-left:1em; float:right"> 5 + <div id="slideshow1" class="slide" style=""><div><img src="/xwiki/bin/download/Main/WebHome/compa-mur.jpg?"></div></div> 6 + <div id="slideshow2" class="slide" style="display: none"><div><img src="/xwiki/download/Main/WebHome/tim visage.jpeg?"></div></div> 7 + <div id="slideshow3" class="slide" style="display: none"><div><img src="/xwiki/download/Main/WebHome/quentin visage.JPG?"></div></div> 8 + <div id="slideshow4" class="slide" style="display: none"><div><img src="/xwiki/download/Main/WebHome/julien visage.JPG?"></div></div> 9 + <div id="slideshow5" class="slide" style="display: none"><div><img src="/xwiki/download/Rouges/WebHome/compa tente.jpg?"></div></div> 10 + 11 + </div> 12 + 13 + 14 + 15 + <script type="text/javascript"> 16 + 17 + start_slideshow(1, 6, 3000); 18 + 19 + function start_slideshow(start_frame, end_frame, delay) { 20 + setTimeout(switch_slides(start_frame,start_frame,end_frame, delay), delay); 21 + } 22 + 23 + function switch_slides(frame, start_frame, end_frame, delay) { 24 + return (function() { 25 + Effect.Fade('slideshow' + frame); 26 + frame = Math.floor(Math.random()*(end_frame-start_frame+1))+start_frame; 27 + //if(console) console.log("Next photo: " + frame); 28 + setTimeout("Effect.Appear('slideshow" + frame + "');", 850); 29 + setTimeout(switch_slides(frame, start_frame, end_frame, delay), delay + 850); 30 + }) 31 + } 32 + 33 + var isGood = document.location.href.startsWith("https://"); 34 + var isWrong = document.location.href.startsWith("http://"); 35 + console.log("Insisting? " + isGood + " " + isWrong); 36 + if(!isGood && isWrong) { 37 + if(console && console.log) console.log("Redirecting to the https side."); 38 + document.location.replace("https://" + document.location.href.substring("http://".length)); 22 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> 125 125 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 - 185 -</div> 186 - 187 - 188 -</body> 189 -</html> 41 + </script> 190 190 {{/html}} 191 -