[JS] Horizontaal submenu in hoofd menu maken?

[Verwijderd]

Hoi mensen,

Ik heb een dringende vraag over Java menu's, ben namelijk bezig met een website en zit al uren te prutsen met Java menu's.Ik kom er maar niet uit. Het hoofdmenu klapt vertikaal uit en daar komen 2 submenu's onder, wat ik graag wil is bij een van die submenu's nog een submenu die dan naar rechts uitklapt met daarin 3 onderwerpen. Is dat mogelijk met Java?. Zoja kan iemand mij dan uitleggen hoe je zoiets doet en graag erbij zeggen hoe ik de menu code kan verwerken in Dreamweaver.

Voorbeeld:



Alvast hartelijk bedankt,

Alex

[disjfa]

www.google.nl -> suckerfish / son of suckerfish

Veel plezier met lezen

[Cyphax]

Als je nog verder wilt gaan zoeken op 't internet, gebruik dan vooral niet als keyword "Java", maar "javascript", dat zijn echt 2 verschillende dingen. Verder zou ik zoals disjfa hierboven al aangeeft ook even kijken naar suckerfish. Hier heb je een Nederlandse pagina met uitleg: http://netters.nl/suckerfish-toegankelijke-dropdown-menus

[Verwijderd]

Hartelijk bedankt , hier red ik het vast wel mee

[_Thanatos_]

Kan toch ook gewoon met pure CSS? Als het alleen om simpel "uitklappen" gaat (zonder effect of iets dus) en je gewoon netjes geneste <ul>'s gebruikt, kun je het uitklappen met CSS realiseren.

[ Voor 7% gewijzigd door _Thanatos_ op 11-01-2008 12:35 ]

[Bozozo]

Nee, IE accepteert namelijk geen :hover op je list items. Die moet je toevoegen met een klein stukje JavaScript. Die techniek wordt Suckerfish genoemd, naar een artikel op A List Apart waar het idee goed is uitgelegd. Sindsdien is er nog vanalles aan verbeterd, en zijn ook multilevel menu's mogelijk gemaakt.

Lees het Sons of Suckerfish artikel op HTMLDog voor meer informatie. Dat geldt m.i. voor iedereen die van plan is een dropdown menu te maken

[TeeDee]

Bozozo schreef op vrijdag 11 januari 2008 @ 12:50:
Nee, IE accepteert namelijk geen :hover op je list items. Die moet je toevoegen met een klein stukje JavaScript. Die techniek wordt Suckerfish genoemd, naar een artikel op A List Apart waar het idee goed is uitgelegd. Sindsdien is er nog vanalles aan verbeterd, en zijn ook multilevel menu's mogelijk gemaakt.

Ik zou dan eigenlijk voor de csshover.htc van Clay gaan.

Of, als je niet met JS aan de slag wilt: je kan het e.e.a. faken door de links in je listelement een fixed width te geven. Dan kan je gewoon de hover op je link houden ipv je li.

[7.01D]

TeeDee schreef op vrijdag 11 januari 2008 @ 12:57:
[...]

Ik zou dan eigenlijk voor de csshover.htc van Clay gaan.

csshover.htc werkt alleen in IE en maakt ook gebruik van JS (wat sommigen nog weleens lijken te vergeten). Het voordeel van iets als Suckerfish is dat je het ook makkelijk kunt uitbreiden voor keyboard-navigatie, met onfocus/onblur op de links zelf. Door JS te gebruiken i.p.v. een behavior (HTC) kun je dit dan ook inzetten voor niet-IE browsers.
Daarnaast vind ik het persoonlijk ook overzichtelijker om scripting en stylesheets gescheiden te houden.

Of, als je niet met JS aan de slag wilt: je kan het e.e.a. faken door de links in je listelement een fixed width te geven. Dan kan je gewoon de hover op je link houden ipv je li.

Hoe dan? De :hover moet immers op een parent van de geneste <ul> zitten en aangezien je geen block-elementen (<ul>) in inline-elementen (<a>) mag plaatsen zou ik niet weten hoe je dat moet doen zonder van die regel af te stappen. Doe je het toch, dan heb je in het geval van een dropdown zelfs te maken met geneste links. Lijkt me niet de bedoeling.

[ Voor 9% gewijzigd door 7.01D op 11-01-2008 13:30 ]

[TeeDee]

7.01D schreef op vrijdag 11 januari 2008 @ 13:25:
[...]
csshover.htc werkt alleen in IE
[...]

Dat is toch ook de vraag/bedoeling? IE begrijpt :hover op andere elementen behalve a niet. Dus is het alleen maar mooi dat het IE only is.

Hoe dan? De :hover moet immers op een parent van de geneste <ul> zitten en aangezien je geen block-elementen (<ul>) in inline-elementen (<a>) mag plaatsen zou ik niet weten hoe je dat moet doen zonder van die regel af te stappen. Doe je het toch, dan heb je in het geval van een dropdown zelfs te maken met geneste links. Lijkt me niet de bedoeling.

Daar heb je inderdaad gelijk in. Was vergeten dat het om geneste lists ging.

[7.01D]

TeeDee schreef op vrijdag 11 januari 2008 @ 13:33:
[...]

Dat is toch ook de vraag/bedoeling? IE begrijpt :hover op andere elementen behalve a niet. Dus is het alleen maar mooi dat het IE only is.

Het ging mij erom dat CSS-only dropdowns niet geschikt zijn voor keyboard navigatie. Daarvoor heb je in het geval van een dropdown altijd JS nodig, ook in Fx, Op en Sf. Suckerfish of iets vergelijkbaars is dan redelijk makkelijk aan te passen zodat het deze manier van navigeren wel ondersteund voor alle browsers. Voor behaviors geldt dat niet.