Comment faire un menu déroulant à 3 niveaux ? - HTML/CSS - Programmation
Marsh Posté le 30-08-2004 à 15:14:44
menu=new Array();
var nb_ad=-1;
var nb_port=0;
var cpt=0;
var nom="";
var nb_result=tabjs1.length;
while (cpt<nb_result)
{
{
nb_port=0;
nb_ad++;
nom=tabjs1[cpt];
menu[nb_ad]=new Array();
for (i=0;i<tabjs[nb_ad].length;i++)
menu[nb_ad][i]=new Option(tabjs[nb_ad][i],tabjs[nb_ad][i])
}
{
}
cpt++;
}
// liste des fonctions JS
function changeSousTheme(numeroMenu){
for (i=document.menuDeroulant.sousTheme.options.length-1;i>0;i--){
document.menuDeroulant.sousTheme.options[i]=null
}
for (i=0;i<menu[numeroMenu].length;i++){
document.menuDeroulant.sousTheme.options[i]=new Option(menu[numeroMenu][i].text,menu[numeroMenu][i].value)
}
document.menuDeroulant.sousTheme.selectedIndex=0
}
function selectmenu(theme_prin){
if (theme_prin.theme.options[theme_prin.theme.selectedIndex].value == "null" ){
alert('selectionnez d\'abord une adresse IP');
}
else{
window.top.location.href = theme_prin.theme.options[theme_prin.theme.selectedIndex].value;
}
}
function destination(){
var destination = document.menuDeroulant.sousTheme.options[document.menuDeroulant.sousTheme.selectedIndex].value;
if(destination=="null" ){
alert('Veuillez saisir une destination valide!');
}
else{
window.top.location.href = destination;
}
}
voici un double menu refait la même chose une fois de plus et ça marche!
Marsh Posté le 30-08-2004 à 15:24:37
Ouh la la
Merci de ta réponse ultra-rapide 23samael
mais je n'y comprends rien.
Je vais peut-être abandonner cette idée
Marsh Posté le 30-08-2004 à 15:26:07
fafane84 a écrit : Ouh la la |
Exact. Utiliser des codes auxquels on ne comprend rien n'a pas de sens.
Soit tu te mets un minimum au JS, soit tu te contentes de choses plus faciles (et parfois tout autant fonctionnelles).
Marsh Posté le 30-08-2004 à 15:33:06
c pas très dur :
- tu crées un menu : menu=new Array();
- tu le remplies : menu[nb_ad][i]=new Option(tabjs[nb_ad][i],tabjs[nb_ad][i])
nb_ad correspond au nombre de choix du menu 1
i correpond au nombre de choix correspondant à l'option du menu 1
les fonctions en dessous servent pour l'affichage automatique lors de la sélection des choix!
Marsh Posté le 30-08-2004 à 15:49:37
Moi quand je vois <script language="javascript">, je zappe...
Merde on est en 2004...
Marsh Posté le 30-08-2004 à 15:59:05
Et c'est sans parler de la non-utilisation du DOM et des names à la place des id...
Marsh Posté le 30-08-2004 à 16:00:26
Hermes le Messager a écrit : Moi quand je vois <script language="javascript">, je zappe... |
Oui mais alors comment faire un menu sans javascript ?
Car j'ai lu çà >>ici<<:
Citation : Des menus déroulants grâce aux CSS |
Et çà (dans le tutos du 1er post) :
Citation : Comme vous le remarquez dans le code Javascript ci-dessous, le script appelle la fonction "montre()" au chargement de |
Alors que faire ?
Marsh Posté le 30-08-2004 à 16:07:31
fafane84 a écrit : Oui mais alors comment faire un menu sans javascript ? |
Si tu veux que le menu fonctionne également avec IE, l'utilisation du JS est obligatoire.
Citation : Et çà (dans le tutos du 1er post) :
|
Un menu en JS + CSS (le JS servant à masquer ou à montrer les sous-menus en réalité composés de div ou autre balise avec un id) qui ne fonctionne pas sans JS, mais qui permet à l'utilisateur d'avoir accès au sous-menu en cliquant sur le titre de chaque menu à l'aide d'un bête lien en HTML.
Marsh Posté le 30-08-2004 à 14:52:10
Salut à tous
J'ai créé 1 menu déroulant selon la méthode de l'excellent site alsacreations.
Seulement voilà, je voudrais faire un menu déroulant à 3 niveaux :
- menu
- sous-menu
- sous-sous-menu
mais je ne connais pas le javascript
De plus quelles balises HTML utiliser ?
Quelqu'un pourrait-il m'aider ?
le code JS :
<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>
le code XHTML :
<dl id="menu">
<dt onclick="javascript:montre();"><a href="#">Menu 1</a></dt>
<dt onclick="javascript:montre('smenu2');">Menu 2</dt>
<dd id="smenu2">
<ul>
<li><a href="#">Sous-Menu 2.1</a></li>
<li><a href="#">Sous-Menu 2.2</a></li>
<li><a href="#">Sous-Menu 2.3</a></li>
</ul>
</dd>
<dt onclick="javascript:montre('smenu3');">Menu 3</dt>
<dd id="smenu3">
<ul>
<li><a href="#">Sous-Menu 3.1</a></li>
<li><a href="#">Sous-Menu 3.1</a></li>
</ul>
</dd>
<dt onclick="javascript:montre('smenu4');">Menu 4</dt>
<dd id="smenu4">
<ul>
<li><a href="#">Sous-Menu 4.1</a></li>
<li><a href="#">Sous-Menu 4.1</a></li>
</ul>
</dd>
</dl>
</div>
Merci d'avance
---------------
Mon Topic de Vente Hardware