Per impostare il menu orizzontale sono partito dal codice
di un menu le cuivoci apribano i sottomenu:
Codice: Seleziona tutto
<div id="navlist_wrapper">
<div id="navlist">
<ul>
<?php // creo i titoli lunghi del menu orizzontale
$barmenu=array("home"=>"Home","chisiamo"=>"Chi siamo","attività"=>"Attività",
"pensiero"=>"amici","Amici"=>"Opere","link"=>"Link","blog"=>"Blog","contatti"=>"Contatti");
foreach($barmenu as $vocemenu=>$valore) {
echo '<li>' . "| ";
if ( ( $sezione || $sottosezione ) && ( $vocemenu == $pagina ) ) {
$addstyle = "style='color:#AFAFAF; font-weight:none; text-decoration:none;'";
} else
{ $addstyle = ""; }
if ($vocemenu == "home" ) {
echo "<a href=\".\" $addstyle>";
} else
{
echo "<a href=\"index.php?pagina=$vocemenu\" $addstyle>";
}
echo $valore;
echo '</a></li>'."\n";
}
?>
</ul>
</div><!--navlist-->
</div><!--navlist_wrapper--> </div><!--header-->
quando ci passa sopra il mouse (nel CSS ricorro a un effetto hover).
Riporto li codice HTML:
Codice: Seleziona tutto
<div id="hormenu">
<!-- Div che contiene il menu --> <ul>
<!-- Lista principale: definisce il menu nella sua interezza --> <li><a href="#">Menu 1</a>
<!-- Primo list-item, prima voce del menu --> <ul>
<!-- Lista annidata: voci del sotto-menu -->
<li><a href="#">Submenu 1</a></li>
<li><a href="#">Submenu 1</a></li>
<li><a href="#">Submenu 1</a></li>
<li><a href="#">Submenu 1</a>
</li> <li><a href="#">Submenu 1</a></li> </ul> <!-- Fine del sotto-menu -->
</li> <!-- Chiudo il list-item -->
<li><a href="#">Menu 2</a>
<!-- Primo list-item, prima voce del menu --> <ul>
<!-- Lista annidata: voci del sotto-menu --> <li><a href="#">Submenu 2</a></li>
<li><a href="#">Submenu 2</a></li>
<li><a href="#">Submenu 2</a></li>
<li><a href="#">Submenu 2</a></li>
<li><a href="#">Submenu 2</a></li>
</ul> <!-- Fine del sotto-menu -->
</li> <!-- Chiudo il list-item --> </div>
Grazie
M.