All pastes #98601 Raw Edit

Someone

public text v1 · immutable
#98601 ·published 2006-07-24 17:19 UTC
rendered paste body
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>

<head>
<title>Menus Déroulants «Suckerfish» - Basique, un niveau</title>

<style type="text/css">

body {
	font-family: arial, helvetica, serif;
}

#nav, #nav ul { /* toutes les listes */
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
	float: right;
}

#nav a {
	display: block;
	width: 10em;
}

#nav li { /* tous les items de liste */
	float: left;
	width: 10em; /* largeur obligatoire, sinon opera devient fou */
}

#nav li ul { /* listes de deuxième niveau */
	position: absolute;
	background: orange;
	float: left;
	left: -999em; /* on met left plutôt que display pour cacher les menus parce que display: none n'est pas lu par les lecteurs d'écran */
}

#nav li:hover ul, #nav li.sfhover ul { /* listes imbriquées sous les items de listes survolés */
	left: auto;
}

#content {
	clear: left;
	color: #ccc;
}

</style>

<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
	var sfEls = document.getElementById("nav").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

//--><!]]></script>


</head>

<body>

<h1>Les REQUINS (1)</h1>
<p>Bienvenue dans le monde des Requins</p>

<table border=1 width=100%><tr>
<td>Foo</td>
<td align=right>
<ul id="nav">
<li><a href="#">Squaliformes</a>
	<ul>
		<li><a href="#">Echinorhinidés</a></li>
		<li><a href="#">Oxynotidés</a></li>
		<li><a href="#">Squalidés</a></li>
	</ul>
</li>

<li><a href="#">Orectolobiformes</a>
	<ul>
		<li><a href="#">Parascylliidés</a></li>
		<li><a href="#">Brachaeluridés</a></li>
		<li><a href="#">Orectolobidés</a></li>
		<li><a href="#">Stégostomatidés</a></li>
		<li><a href="#">Hémiscylliidés</a></li>
	</ul>
</li>


	<li><a href="#">Carcharhiniformes</a>
		<ul>
			<li><a href="#">Scyliorhinidés</a></li>
			<li><a href="#">Proscylliidés</a></li>

			<li><a href="#">Pseudotriakidés</a></li>
			<li><a href="#">Leptochariidés</a></li>
			<li><a href="#">Hémigaléidés</a></li>
			<li><a href="#">Triakidés</a></li>
			<li><a href="#">Sphyrnidés</a></li>
			<li><a href="#">Carcharhinidés</a></li>

		</ul>
	</li>

</ul>
</td>
</tr></table>

              
<div id="content">
	<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse egestas ultricies pede. Phasellus suscipit blandit risus. Praesent nonummy. In erat. Duis nibh pede, accumsan eu, pulvinar et, volutpat vel, elit. Curabitur nec dui sed nunc congue tempus. Nulla ac dui ac libero fringilla nonummy. Maecenas ullamcorper sodales risus. Vivamus pretium dolor. Proin eu turpis. Phasellus ut mauris non nulla mattis luctus. Nunc porttitor dapibus sapien. In malesuada fermentum metus. Nulla egestas, tellus a vestibulum pharetra, nunc purus auctor lacus, ut semper purus ipsum eu velit. Praesent dui. Nulla accumsan turpis at erat.</p>

	<p><a href="">Menus déroulants «Suckerfish»</a> de <a href="http://www.htmldog.com/">Patrick Griffiths</a> et <a href="http://www.danwebb.net">Dan Webb</a>. Traduction française <a href="http://www.pompage.net">Pompage Magazine</a></p>
</div>

</body>

</html>