Salve a tutti...
ho realizzato un menu con css e javascript....ma le voci del menu a tendina non mi vanno a capo...nn riesco a trovare una soluzione..posto il codice CSS e il javascript...
www.rionecontrastanga.net/nuovo/home.php
CSS
A:link {
text-decoration: none;
color: yellow;
}
A:visited {
text-decoration: none;
color: yellow;
}
A:active {
text-decoration: none
}
A:hover {
text-decoration: none;
color: #2922BE;
}
BODY {
FONT-FAMILY: arial, helvetica, serif
}
UL {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px;
LIST-STYLE-TYPE: none;
}
LI {
FLOAT: left;
WIDTH: 85px;
height: 21px;
POSITION: relative;
BACKGROUND-COLOR: trasparent;
padding-bottom: 0px;
color: yellow;
font-style: arial;
BORDER-right: 0px solid yellow;
vertical-align: bottom;
}
#home{
FLOAT: left;
WIDTH: 50px;
height: 21px;
POSITION: relative;
BACKGROUND-COLOR: trasparent;
padding-bottom: 0px;
color: yellow;
font-style: arial;
BORDER-right: 1px solid yellow;
vertical-align: bottom;
}
#menu{
border: 0px solid red;
background-image: url(../image/menu.jpg);
width: 760px;
height: 22px;
float:left;
font-size:12px;
BORDER-right: 1px solid yellow;
text-indent: 0px;
vertical-align: bottom;
margin-top: 1px;
margin-bottom: 1px;
}
#img{
BORDER-right: 1px solid yellow;
}
Html incluso in un altra pagina
<UL id=nav>
<LI id=home>
[img]image/home.gif[/img]
</LI>
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Il Contrastanga</p>
</A></LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Sede
</A></LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Consiglio
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Albo D'oro
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Priori
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Cavalieri
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Inni
</A> </LI>[/list]
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Come Raggiungerci
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Menu
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Menu Gruppo
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Prenotazioni On-Line
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Gareggiare dei Convivi
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Ricette di “Nonna Checca”
</A> </LI>[/list]
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Il Furente
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
I Cavalli
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Le Prove (tempi)
</A> </LI>[/list]
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Il Percorso
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Costumi
</A>
</LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
Fiera dei Sovrastanti
</A>
</LI>[/list]</LI>
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-01
</A>
</LI>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-02
</A>
</LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-03
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-04
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-05
</A> </LI>[/list]
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-01
</A>
</LI>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-02
</A>
</LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-03
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-04
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-05
</A> </LI>[/list]
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-01
</A>
</LI>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-02
</A>
</LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-03
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-04
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-05
</A> </LI>[/list]
<LI id=img>
[img]image/home.gif[/img]
<UL id=sottomenu>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-01
</A>
</LI>
<LI><A
href="http://www.htmldog.com/articles/suckerfish/bones/">
03-02
</A>
</LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-03
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-04
</A> </LI>
<LI><A href="http://www.htmldog.com/articles/suckerfish/bones/">
03-05
</A> </LI>[/list]
Javascript
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;
spero di essere stato chiaro...