Menu transportable dans une JSP

**coshibe** · 14/11/2011, 12h25

Bonjour à tous,

Je suis en train de travailler sur ma première application web, et me voilà confronté à la création du menu. Actuellement le framework utilisé pour le menu est immangeable et on me laisse libre de changer cela. Donc je venais vers vous pour connaitre vos solutions/ habitudes/ conseils en matière de menu.

En sachant que je travaille donc avec des JSP, que ma seule contrainte est la taille du conteneur de menu et qu'il faut que le code du menu soit dans une page unique qu'on appellera dans les JSP. Je dois également pouvoir gérer les sous menus en pop_menus, comme sur ce site quand on passe sur la barre de menus en haut, sur conception apparaissent 3 sous menus, etc..

Si par ailleurs vous connaissez des tutoriels concernant la création de menus, je vous serai vraiment reconnaissant de les partager avec moi.

J'attends vos conseils avec impatience.

edit : Après quelques recherches approfondies j'ai jugé préférable de reposer ma question plus clairement à un endroit qui conviendra sans doute mieux : http://www.developpez.net/forums/d11...p/#post6343626

Mais si vous avez des propositions n’hésitez surtout pass!

**coshibe** · 15/11/2011, 12h08

Alors voilà ou j'en suis avec mon menu :
J'ai fait un bete menu en HTML avec lili et lulu :
Je l'ai appelée menuBody.html (il n'ya pas de balise html, body)

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
<ul id="menu">
 
        <li>
                <a href="#">accueil</a>
        </li>
 
        <li>
                <a href="#">membres</a>
                <ul>
                        <li><a href="#">connexion</a></li>
                        <li><a href="#">inscription</a></li>
                </ul>
        </li>

Je vous épargne la suite

et voici la page ou j'appelle le menu avec <object> :

Code :

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
<html>
 
<head>
<link href="menuCSS.css" type="text/css" media="screen" rel="stylesheet">
<script type="text/javascript">
<!--[if lte IE 6]>
sfHover = function() {
        var sfEls = document.getElementById("menu").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);
<![endif]-->
</script>
</head>
<body>
<object data="menuBody.html" type="text/html" width="300" height="600"/>
</body>
</html>

le soucis c'est que de cette maniere j'ai l'impression que tout le css appliqué au menu n'est pas pris en compte et je ne comprends pas bien pourquoi.

voici une partie du css :

Code :

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
#menu li /* Elements des listes */      
{ 
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li
{
        border-right: 1px solid transparent ; /* on met une bordure transparente à droite de chaque élément */
}
 
#menu li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
        width: 144px; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
		margin    : -22px 0 0 144px ; 
        border-left     : 1px solid #fff ; /* Petite bordure à gauche pour ne pas coller ... */ 
}
 
#menu li ul li 
{
        border-top : 1px solid #fff;
}
 
html>body #menu li ul li                
{
        border-top : 1px solid transparent; 
}

donc concrètement mon problème c'est l'importation du menu, puisque je ne peux pas utiliser le php je me suis rabattu sur la balise object, mais je ne comprends pas pourquoi ca ne prend pas en compte mon css. Si quelqu'un à une solution à mon probleme, ou meme une autre methode je suis preneur