Vertikal dropdownmeny fra horisontal tekstmeny

[oya]

Hei! Noen som vet om en enkel måte å få dropdown slik som på denne siden http://www.tjkdesign.com/articles/keyboard...enu/default.asp

 

Helst ikke noe javascriptgreier, og skal ha ren tekst som hovedlinker, og en ramme som kommer under med tekstlinker i en og samme celle. Skal være enklest mulig. Bare en bakgrunnsfarge og en farge som kant rundt hele tabellen som kommer ned.

 

På forhånd takk!

[Anders Moen]

Tror JavaScript må til for å få det til å fungere i alle nettlesere...men er ikke helt sikker

 

http://www.dynamicdrive.com/style/csslibra...enu-horizontal/

[Stian Jacobsen]

Bruk google å søk etter suckerfish dropdown

Tror DHTML-goodies har et bra script

[oya]

Tror JavaScript må til for å få det til å fungere i alle nettlesere...men er ikke helt sikker

 

http://www.dynamicdrive.com/style/csslibra...enu-horizontal/

Den demoen var veldig buggy da...

[Anders Moen]

Hva var det som feil med den menyen da? Funker nå helt fint den

[oya]

Bruk google å søk etter suckerfish dropdown

Tror DHTML-goodies har et bra script

Ikke så alt for dum den der, men funker ikke helt slik jeg vil. Ellers ser jeg at dropdownmenyen her når jeg skriver innlegg er veldig fin. "Insert Special Item" eksempelvis.

 

Har to problemer.

- Den rammen som popper opp kommer til høyre, og ikke under hoverlinken.

- Rammen er "gjennomsiktig". Det som er i bakgrunnen blander seg inn.

 

Css:

ul {
padding: 0;
margin: 0;
list-style: none;
border: 1px solid #000000;
background-color: #CCCCCC;
 }

li {
 float: left;
 position: relative;
 width: 10em;
 }
li ul {
 display: none;
 position: absolute; 
 top: 1em;
 left: 0;

 }
li > ul {
top: auto;
left: auto;

}
li:hover ul { display: block; 
}

[oya]

Nå har jeg brukt kode fra denne: http://sperling.com/examples/menuh/

 

Funker egentlig veldig greit etter at jeg fikk modifisert css'en, men ser ut til at undermenyen ikke kommer frem loddrett under hverandre, men heller følger bredden på hele menyen.

 

Tips?

 

Link til siden jeg utvikler

[oya]

Sitter på skolen nå, og ser at dette blir helt forskjellig i IE6, IE7 og firefox. Dårlige greier. Noen som vet om en løsning som gjør at det ser likt ut i alle browsere. Ser jo at mange skryter av at det ikke trengs javascript (uten at jeg helt ser det negative...?). Kanskje en løsning med javascript funker bedre. Noen tips?

[oya]

Er det noen som har erfaring med et script, og vet det fungerer i de viktigste browserne? Synes det som er i prisguiden funker bra. Når man kan velge eksempelvis alle produktene til en produsent.

[Haraldson]

Som sagt, Suckerfish.

[oya]

Som sagt, Suckerfish.

Hmm. Den versjonen så nyere ut. Funker fint, men hvordan i alle dager går jeg frem om jeg kun vil ha 1 space mellom hver menyvalg, og ikke forhåndsbestemt bredde på hvert felt.

 

Altså, alt ser bra ut, foruten mellomrommene mellom hvert hovedvalg

 

Link

[Haraldson]

#nav li { width: 8em; } burde vel være et naturlig utgangspunkt for videre feilsøking.

 

(Give-away; ul li ul li arver egenskaper fra ul li, og ved å f.eks. definere egne verdier for #nav ul li skulle du være i mål.)

[oya]

#nav li { width: 8em; } burde vel være et naturlig utgangspunkt for videre feilsøking.

 

(Give-away; ul li ul li arver egenskaper fra ul li, og ved å f.eks. definere egne verdier for #nav ul li skulle du være i mål.)

Har prøvd å fikse det slik, men får ikke til. Dropdownvalgene kommer bare vannrett.