-
[=Bk=]nikihd.
User deleted
CSS Menų Dropdown su pių livelli
Ecco qui una guida per poter avere dei menu su questo stile:
http://dropdown.forumfree.it/
Utilizza solo css č puō essere inserito direttamente dalla Gestione Codici HTMLCITAZIONENB: Internet Explorer non supporta la proprietā hover usata su elementi diversi da a. Dato che in questo menu viene usata la proprietā hover anche su li, chi utilizza Internet Explorer non potrā visualizzare i sottolivelli del menu, ma solo il primo.
Inserite in modifica colori e stili questo codice:CODICE#menu {padding:0; margin:0; font-family: Verdana,Arial; font-size: 0.70em;}
#menu ul {padding: 0px; margin: 0px;}
#menu li {position: relative; float: left; list-style: none; margin: 0px; padding: 0px; border-bottom: 1px solid #DDD; border-left: 1px solid #DDD;}
#menu li a {width:150px; height: 30px; display: block; text-decoration: none; text-align: center; line-height: 30px; color: #333; background: #FF0000;}
#menu li a:hover {background: #000000;}
#menu ul ul {position: absolute; top: 30px; visibility: hidden;}
#menu ul li:hover ul {visibility: visible;}
#menu ul ul ul li {visibility: hidden; left: 150px; top: -30px;}
#menu ul ul li:hover ul li {visibility: visible;}
#menu č il selettore del div contenitore del menu
#menu ul serve per distanziare fra loro i vari livelli, non modificatelo
#menu li serve per stabilire principalmente le caratteristiche del primo livello
#menu li a serve per stabilire le caratteristiche dei blocchi del menu
#menu li a:hover serve per stabilire le caratteristiche dei blocchi al momento del rollover (passaggio col mouse)
#menu ul ul serve per stabilire la posizione del secondo livello rispetto al primo (il valore di top devi coincidere con l'altezza dei blocchi). Non bisogno modificare il visibility: hidden;
#menu ul li:hover ul permette al secondo blocco di apparire al solo passaggio del mouse.
#menu ul ul ul li serve per stabilire la posizione del terzo livello rispetto al secondo (il valore di top e left deve combaciare con la larghezza e l'altezza dei blocchi). Non bisogno modificare il visibility: hidden;
#menu ul ul li:hover ul li permette al terzo blocco di apparire al solo passaggio del mouse.
Dopo aver inserito il css andremo ad inserire l'html:CODICE<div id="menu">
<ul>
<li><a href="#">Menu 1</a>
<ul>
<li><a href="#">Menu 1-1</a></li>
<li><a href="#">Menu 1-2</a>
<ul>
<li><a href="#">Menu 1-2-1</a></li>
<li><a href="#">Menu 1-2-2</a></li>
<li><a href="#">Menu 1-2-3</a></li>
</ul>
</li>
<li><a href="#">Menu 1-3</a></li>
</ul>
</li>
<li><a href="#">Menu 2</a>
<ul>
<li><a href="#">Menu 2-1</a></li>
<li><a href="#">Menu 2-2</a></li>
<li><a href="#">Menu 2-3</a></li>
</ul>
</li>
<li><a href="#">Menu 3</a>
<ul>
<li><a href="#">Menu 3-1</a></li>
<li><a href="#">Menu 3-2</a></li>
<li><a href="#">Menu 3-3</a>
<ul>
<li><a href="#">Menu 3-3-1</a></li>
<li><a href="#">Menu 3-3-2</a></li>
<li><a href="#">Menu 3-3-3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>SPOILER (click to view)<!--INIZIO CODICE MENU-->
<div id="menu">
<!--INIZIO PRIMO LIVELLO-->
Menu 3
<!--INIZIO SECONDO LIVELLO-->
Menu 3-1
Menu 3-2
Menu 3-3
<!--INIZIO TERZO LIVELLO-->
Menu 3-3-1
Menu 3-3-2
Menu 3-3-3
<!--FINE TERZO LIVELLO-->
<!--FINE SECONDO LIVELLO-->
<!--FINE PRIMO LIVELLO-->
<!--FINE CODICE MENU-->
LO STAFF, autorizza l'uso e la copia in altri forum e/o siti.
= Blood Killer =
. -
Black Ulquiorra.
User deleted
scusa come faccio a farlo muovere? . -
[=Bk=]nikihd.
User deleted
farlo muovere in che senso? .
CSS Menų Dropdown su pių livelli |
