Discussion: Liste déroulante
Afficher un message
Vieux 01/05/2008, 17h39   #4
SAM
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: Liste déroulante

SAM a écrit :
>
> et mieux ?


<html>
<script type="text/javascript">
var R;
function cachetout() {
for(var i=0; i<R.length; i++) R[i].style.display='none';
}
function show(quoi) {
quoi = quoi.href.split('#')[1];
cachetout();
document.getElementById(quoi).style.display='';
return false;
}
window.onload = function() {
R = document.getElementById('rubriques');
R = R.getElementsByTagName('DIV');
cachetout();
var L=document.getElementById('menu').getElementsByTag Name('A');
for(var i=0; i<L.length; i++)
L[i].onclick=function(){return show(this);};
document.getElementById('truc_1').style.display='' ;
}
</script>
<style type="text/css">
#menu { list-style: none; width: 140px; float:left;
height: 90%; overflow: auto;}
#rubriques { margin-left: 170px;
height: 90%; overflow: auto;}
</style>

<ul id="menu">
<li><a href="#truc_1">rubrique 1</a></li>
<li><a href="#truc_2">rubrique 2</a></li>
<li><a href="#truc_3">rubrique 3</a></li>

<li><a href="#truc_50">rubrique 50</a></li>
</ul>
<div id="rubriques">
<div id="truc_1">
<h2>rubrique 1</h2>
<p> bla bla 1</p>
</div>
<div id="truc_2">
<h2>rubrique 2</h2>
<p> bla bla 2</p>
</div>
<div id="truc_3">
<h2>rubrique 3</h2>
<p> bla bla 3</p>
</div>


<div id="truc_50">
<h2>rubrique 50</h2>
<p> bla bla 50/p>
</div>
</div>
</html>


devrait fonctionner avec et sans JS
--
sm
  Réponse avec citation
 
Page generated in 0,05218 seconds with 9 queries