| Precedente :: Successivo |
| Autore |
Messaggio |
atigra
Semidio
Registrato: 21/09/05 11:14
Messaggi: 249
|
 Inviato: 03 Mar 2006 11:28 Oggetto: Problema con menu e sottomenu css + javascript |
 |
|
Guardando in giro per la rete, ho trovato un menù con le relative sottovoci realizzato con i css + javascript. So che non è tanto buona come idea visto che se si disabilita js non vengono visualizzate le sottovoci, ma ho previsto che si possa lo stesso cliccare sulla voce "padre" e arrivare ad una certa pagina in cui fare altre scelte.
Il mio problema attuale è che, quando col mouse ci si sposta sopra ad una delle voci con sottomenù, viene spostato tutto più sotto e la parte che comunque appare non è molto utilizzabile... insomma, più difficile da dire che da vedere:
test.
Questo è il codice del css relativo al menù:
| Codice: |
#menu{
font-family: verdana, arial, sans-serif;
width: 135px;
margin-top: 40px;
padding-bottom: 15px;
float: left;
color: #000;
}
#menu ul{
width: 135px;
list-style: none;
margin-top: 40px;
margin-left: 0px;
margin-bottom: 0px;
padding: 0px;
background: #d7d1d3;
border-right: 1px ridge #c0c0c0;
margin:0;
padding:0;
list-style:none;
}
#menu ul a{
color: #2b7d8b;
background: #d7d1d3 url(grafica/stile1.png) no-repeat center left;
display:block;
text-decoration:none;
height: 20px;
padding-left: 15px;
font-weight: bold;
}
#menu a:hover {
color: #000;
background: url(grafica/stile2.png) no-repeat center left;
}
#menu ul li{
margin:0;
float:none !important;
float:left;
width:100%;
}
#menu ul li li{
background:transparent;
}
#menu ul li ul.subMenu-off{
position:absolute;
visibility:hidden;
}
#menu ul li ul.subMenu-on{
width:150px;
padding:0px;
list-style:none;
position:relative;
left:140px;
top:-20px;
z-index:50;
}
#menu ul ul{
margin:0;
color:#000;
}
#menu ul ul a{
border:none;
}
#menu ul ul.subMenu-on{
background:#fff;
color:#000;
}
#menu ul ul.subMenu-on a{
/* border: 1px solid #e1c000; */
/* border-left:10px solid #e1c000; */
}
|
Non riesco però a trovare dove stanno gli errori. |
|
| Top |
|
 |
horus
Macchinista
Registrato: 22/03/05 10:48
Messaggi: 2554
Residenza: Sirio e dintorni
|
| Inviato: 03 Mar 2006 12:26 Oggetto: |
|
|
Io non vedo nessun sottomenu. Ho provato con Opera, IE e FF, vedo tre grafiche diverse (suppongo che tu debba ancora metterle a posto) e warning php di inclusione.
Comunque, per non occupare lo spazio sulla pagina al posto di visibility:hidden; nella classe subMenu-off prova ad usare display:none; |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 03 Mar 2006 12:46 Oggetto: |
|
|
concordo col display none; vedo il sottomenu nel codice, ma non vedo nel css alcun comando per ri-rendere visibile il sottomenu  |
|
| Top |
|
|
atigra
Semidio
Registrato: 21/09/05 11:14
Messaggi: 249
|
| Inviato: 03 Mar 2006 13:36 Oggetto: |
|
|
ehm.... chissà che casino ho fatto... sistemo e rimetto il link appena pronto... scusatemi  |
|
| Top |
|
|
atigra
Semidio
Registrato: 21/09/05 11:14
Messaggi: 249
|
| Inviato: 03 Mar 2006 14:20 Oggetto: |
|
|
Scusatemi, c'era un css sbagliatissimo, adesso sono al punto che con FF viene visualizzato alla perfezione, ma con Opera e IE è un disastro... 
Pagina
CSS:
| Codice: |
#menu{
width:150px;
/* position:absolute; */
/* left:1em; */
/* background:#ffc; */
color:#000;
float: left;
padding-bottom: 15px;
}
#menu ul{
margin-top: 40px;
padding:0;
list-style:none;
}
#menu ul a{
/* padding:2px 5px 2px 7px; */
/* border: 1px solid #e1c000; */
border-left:2px solid #2b7d8b;
display:block;
text-decoration:none;
background: #d7d1d3 /* url(grafica/stile1.png) no-repeat center left */;
padding-left: 10px;
height: 20px;
font-weight: bold;
color: #2b7d8b;
}
#menu a:hover {
color: #000;
background: #d7d1d3 /* url(grafica/stile2.png) no-repeat center left*/ ;
}
#menu ul li{
margin:0;
float:none !important;
float:left;
width:100%;
position:relative;
margin-bottom: -1px;
}
#menu ul li li{
background:transparent;
}
#menu ul li ul.subMenu-off{
position:absolute;
/* visibility:hidden; */
display: none;
}
#menu ul li ul.subMenu-on{
width:150px;
padding:0;
list-style:none;
position:absolute;
left:140px;
top:0;
z-index:50;
}
#menu ul ul{
margin:0;
padding:0 0 0 1.5em;
list-style:square;
/* background:#ffc; */
color:#000;
}
#menu ul ul a{
border:none;
}
#menu ul ul.subMenu-on{
background:#fff;
color:#000;
}
#menu ul ul.subMenu-on a{
/* border: 1px solid #e1c000; */
/* border-left:10px solid #e1c000; */
}
|
|
|
| Top |
|
|
juzo kun
Dio maturo
Registrato: 19/04/04 09:32
Messaggi: 1853
Residenza: tra la tastiera e la sedia
|
| Inviato: 04 Mar 2006 01:22 Oggetto: |
|
|
Sparo totalmente a casaccio: prova a commentare la stringa height:20px da questo gruppo:
| Codice: | #menu ul a{
/* padding:2px 5px 2px 7px; */
/* border: 1px solid #e1c000; */
border-left:2px solid #2b7d8b;
display:block;
text-decoration:none;
background: #d7d1d3 /* url(grafica/stile1.png) no-repeat center left */;
padding-left: 10px;
height: 20px;
font-weight: bold;
color: #2b7d8b;
} |
e vediamo che succede
Cià
JK |
|
| Top |
|
|
atigra
Semidio
Registrato: 21/09/05 11:14
Messaggi: 249
|
| Inviato: 04 Mar 2006 09:57 Oggetto: |
 |
|
| juzo kun ha scritto: | Sparo totalmente a casaccio: prova a commentare la stringa height:20px da questo gruppo:
| Codice: | #menu ul a{
/* padding:2px 5px 2px 7px; */
/* border: 1px solid #e1c000; */
border-left:2px solid #2b7d8b;
display:block;
text-decoration:none;
background: #d7d1d3 /* url(grafica/stile1.png) no-repeat center left */;
padding-left: 10px;
height: 20px;
font-weight: bold;
color: #2b7d8b;
} |
e vediamo che succede
Cià
JK |
Nada... resta sempre dov'è e in più le varie voci del menù sono un po' troppo appiccicate. |
|
| Top |
|
|
|
FAQ
Cerca
Lista utenti
Gruppi
Registrati
Profilo
Messaggi privati
Log in
