Menu orizzontale con tendina orizzontale

AgoNow

Nuovo Utente
4 Ago 2014
10
0
0
Salve a tutti,
avrei bisogno di realizzare un menu orizzontale con la tendina orizzontale.
Come posso fare?

Grazie mille!
 

AgoNow

Nuovo Utente
4 Ago 2014
10
0
0
Puoi specificare un pochettino meglio?
Vorrei una cosa del genere.
Se io faccio clik la voce del menu "Testo1", la tendina deve apparire orizzontale e non in verticale.
Non so se adesso mi sono spiegata un tantino meglio.

Testo1 Testo2 Testo3 Testo4
- Uno | Due | Tre |Quattro


Grazie.
 

glm2006ITALY

Moderatore
Membro dello Staff
MOD
9 Apr 2009
1.261
11
38
33
Vercelli
www.webepc.it
Uhm... c'era un bello script che permette di fare una cosa simile, se non ricordo male si chiama "image menu" (javascript)

L'ho usato per il sito frabomoda.com

E' questo che intendi oppure un vero e proprio menù "a scrolling" ?
 

AgoNow

Nuovo Utente
4 Ago 2014
10
0
0
Ehm.. no! io ho solo testo, zero immagini.

Testo1_______Testo2_______Testo3 [sono le voci del menu]
--- Uno | Due | Tre [voci della tendina]

Testo1_______Testo2_______Testo3
-------------------- Uno | Due | Tre

Testo1_______Testo2_______Testo3
------------------------------------- Uno | Due | Tre

Forse adesso si capisce un po' meglio!
 

glm2006ITALY

Moderatore
Membro dello Staff
MOD
9 Apr 2009
1.261
11
38
33
Vercelli
www.webepc.it
Si si... immaginavo.

Sull'html5 lascio: ammetto che devo ancora approfondire ^^

Son sicuro che si potrebbe fare con javascript o jquery.

Provato a cercare su Google "menu scroll horizontal" ?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, puoi provare con il selettore dei css hover
ti posto uno schema
HTML:
<style>
    ul {
        position: static;
        list-style-type: none;
    }
    ul li {
        float: left;
        margin: 0 10px;
        cursor: pointer;
    }
    ul li ul {
        position: absolute;
        display: none;
    }
    ul li:hover ul {
        display: block;
    }
</style>
<ul>
    <li>menu 1
        <ul>
            <li>item 1</li>
            <li>item 1</li>
            <li>item 1</li>
        </ul>
    </li>
    <li>menu 2
        <ul>
            <li>item 2</li>
            <li>item 2</li>
            <li>item 2</li>
        </ul>
    </li>
</ul>
Se invece lo vuoi al click dovrai creare qualcosa con javascript
 

AgoNow

Nuovo Utente
4 Ago 2014
10
0
0
Grazie milleeeeeeeeeeeeeeeeeeeeeeeeee!!!!!
Adesso vedo di aggiungerci un po' di grafica :)
 

AgoNow

Nuovo Utente
4 Ago 2014
10
0
0
Una cosa sola vorrei chiedere.
E' possibile far iniziare il testo della tendina proprio in corrispondenza del pulsante?
Per intenderci:

Testo1______ Testo2______Testo3
____________Prova2 | Prova2 | Prova2

e non

Testo1______ Testo2______Testo3
__________________Prova2 | Prova2 | Prova2
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
togli margin e padding alla ul interna
Codice:
ul li ul {
        margin:0;
        padding:0;
        position: absolute;
        display: none;
    }
e volendo anche il margine sinistro delle <li> interne
 
Ultima modifica: