Discussion :

[kadilldév]

Bonjour,je suis un débutant en css , j'ai télécharger une maquette afin de l'adapter a mon besoin , et je veux que les sous menu se changent après un clic sur un menu parent, j'ai aucune idée,surtout que dans cette maquette le clic sur un menu parant par exemple 'Content' offre une nouvelle page avec la même structure mais des sous menu différents à la page mère.Merci d'avance de m'éclairer la route
voici le lien du démo de la maquette :
http://www.templatescreme.com/demo/profi-admin/170
et le lien du téléchargement :
http://www.templatescreme.com/free-website-profi-admin

[Torgar]

Et donc ? Tu veux qu'on le fasse à ta place ?

[kadilldév]

lol,c'est un forum d'aide pas de freelance n'est ce pas? et donc je veux que vous m'aider de trouver des tutoriaux

[rodolphebrd]

Bonjour,

en levant les yeux vous trouverez dans la galerie css certainement une réponse

[kadilldév]

Re-Bonjour, j'ai résolu mon problème. Ma situation s'agit de 5 menus parents et 5 sous menus. J'ai décidé d'afficher un seul sous menu à la fois. J'utilise ce script "JS" :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
function afficheId(baliseId) {
    if (document.getElementById && document.getElementById(baliseId) != null) {
        document.getElementById(baliseId).style.visibility = 'visible';
        document.getElementById(baliseId).style.display = 'block';
    }
}
 
function cacheId(baliseId) {
    if (document.getElementById && document.getElementById(baliseId) != null) {
        document.getElementById(baliseId).style.visibility = 'hidden';
        document.getElementById(baliseId).style.display = 'none';
    }
}

Lors du clic dans un Menu parent j'affiche son sous menu et je cache les autres et voila le codes de deux menus parents et de leurs sous menus :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<ul class="group" id="menu_group_main">
		<li class="item first" id="one">
		<a href="javascript:afficheId('sous_menu_Interactive');" 
		onclick="javascript:cacheId('sous_menu_Contenu');
		javascript:cacheId('sous_menu_Analyse');
		javascript:cacheId('sous_menu_Revue');
		javascript:cacheId('sous_menu_Administration')"
         class="main current"><span class="outer"><span class="inner dashboard">Interactive</span></span></a></li>
        <li class="item middle" id="two"><a 
		href="javascript:afficheId('sous_menu_Contenu');" 
		onclick="javascript:cacheId('sous_menu_Interactive');
		javascript:cacheId('sous_menu_Analyse');
		javascript:cacheId('sous_menu_Revue');
		javascript:cacheId('sous_menu_Administration')"
		class="main"><span class="outer"><span class="inner content">Contenu</span></span></a></li>
</ul>
 
<!-- MENU END -->
 
<div class="grid_16">
<!-- TABS START -->
    <div id="tabs">
         <div class="container">
            <ul id="sous_menu_Interactive">
                      <li><a href="#" class="current"><span>Commentaires</span></a></li>
                      <li><a href="#"><span>Inscriptions Newsletter</span></a></li>
                      <li><a href="#"><span>Envois Newsletter</span></a></li>
 
           </ul>
           <ul id="sous_menu_Contenu">
                      <li><a href="#" class="current"><span>Articles</span></a></li>
                      <li><a href="#"><span>Rubriques</span></a></li>
                      <li><a href="#"><span>Spécial</span></a></li>
                      <li><a href="#"><span>Menus</span></a></li>
                      <li><a href="#"><span>Categories publications</span></a></li>
                      <li><a href="#"><span>Publications</span></a></li>
                      <li><a href="#" class="more"><span>Mots clés</span></a></li>            
           </ul>

Et voila le css des sous menus :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
#sous_menu_Interactive {
   visibility:hidden;
   display:none;
}
#sous_menu_Contenu{
   visibility:hidden;
   display:none;
}

Que pensez-vous de ce bricolage ?