Avatar billede mostcrazy Nybegynder
11. februar 2009 - 13:43 Der er 9 kommentarer og
1 løsning

Forlænge tid dropdown menu vises

Hej,

Jeg har en dropdown menu integreret i et modx (cms) website.

Menuen er baseret på http://www.muddydogpaws.com/development/wayfinder/examples/example-1.html

Mit problem er, at når denne menu blive tilpasset mit design, så kan musemakøren ikke nå fra hovedmenupunktet og ned i dropdown listen før dropdown listen forsvinder.

Er der nogle geniale ideer til hvordan jeg evt. kan lave en tidsforsinkelse på dropdown delen? eller andre forslag til hvordan dette kan løses?

Den css der styre menuen ser således ud:
_______________________________________________________________
/* common styling */
.menu {width:600px; position:absolute; font-size:11px; margin:2px 0 100px 0; z-index:100;left:260px;top:108px;}
.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000;width:104px; height:25px; text-align:left;line-height:25px; font-size:12px; overflow:hidden;}
.menu ul {padding:0px; margin:0;list-style-type: none; }
.menu ul li {float:left; margin-right:1px; position:relative;}
.menu ul li ul {display: none;}

/* specific to non IE browsers */
.menu ul li:hover a {}
.menu ul li:hover ul {display:block; position:absolute; top:23px; left:0; width:105px;}
.menu ul li:hover ul li a.hide {background:#d7d7d7; color:#000000;}
.menu ul li:hover ul li:hover a.hide {background:#f3f3f3; color:#000000;}
.menu ul li:hover ul li ul {display: none;}
.menu ul li:hover ul li a {display:block; background:#d7d7d7; color:#000;}
.menu ul li:hover ul li a:hover {background:#f3f3f3; color:#000;}
.menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;}
.menu ul li:hover ul li:hover ul.left {left:-105px;}
_______________________________________________________________


På forhånd tak :-)
Avatar billede zuran Nybegynder
11. februar 2009 - 14:59 #1
Så vidt jeg kan se, er det en ren CSS menu, der ingen Javascript bruger. Derfor vil menuen altid forsvinde lige i det, at markøren holdes væk fra et af de elementer, der sørger for menuen vises.

De eneste mulige løsninger må jo så være, at afstanden mellem hovedmenupunktet og dropdownen reduceres nok, eller man placerer noget usyneligt imellem. Det ville gøre det en hel del nemmere, hvis man kunne se din side, for at se hvordan design og menu er sat sammen osv.
Avatar billede olebole Juniormester
11. februar 2009 - 15:02 #2
<ole>

Det giver ikke rigtig mening at lave den slags menuer med CSS som funktionalitets motor - det har CSS aldrig været beregnet til.

Den slags funktionalitet er det meningen, du skal bruge script til - så du må nok ud og finde en menu i JavaScript i stedet.

/mvh
</bole>
Avatar billede OskarRough Nybegynder
11. februar 2009 - 15:34 #3
Det er lidt sværere uden et konkret eksempel. Din fejl skyldes ofte, at der er brugt margin et sted, hvorfor der kommer et hul, så du mister menuen.

Du kan forsøge at fjerne margin og bruge padding i stedet, så dine menuer stadig grænser op til hinanden.
Avatar billede olebole Juniormester
11. februar 2009 - 16:30 #4
- men det er ikke nødvendigt, hvis bare man laver menuen rigtigt (= bruger JavaScript)  ;o)
Avatar billede mostcrazy Nybegynder
11. februar 2009 - 17:47 #5
yes jeg ved godt, at JS er den rigtigste måde, at lave sådan noget på, men jeg er desværre ikke den store JS haj, og da der som nærmest standard er adgang til en række dropdown i css, så har jeg valgt, at bruge dem.

Siden kan ses her www.test-2.dk hvis det er hjælp :-) Jeg har opdaget, at problemet åbenbart primært er udbredt i IE7 og ikke i IE6 + Firefox
Avatar billede olebole Juniormester
11. februar 2009 - 22:47 #6
Avatar billede mostcrazy Nybegynder
12. februar 2009 - 09:25 #7
men jeg har ikke viden til hvordan den menu tilpasses til det cms.
Avatar billede olebole Juniormester
12. februar 2009 - 13:23 #8
Nøøhhh, men grunden, til vi mødes her, er jo, at du ikke kan tilpasse CSS-menuen ... så det bør vel ikke kunne afskrække  =)
Avatar billede OskarRough Nybegynder
13. februar 2009 - 17:56 #9
Du kan tage et kig på denne side: http://www.cssmenus.co.uk - der burde være rigeligt til at se, hvordan man kan lave dropdowns med css.

Jeg kender ikke modx, men du skal vel bare sørge for, at menuen bliver printet som en liste, så burde css kunne klare resten.. (uden js :p)
Avatar billede mostcrazy Nybegynder
21. maj 2009 - 12:12 #10
Vi lukker og slukker her. Problemet blev løst ved at indsætte et baggrundsbillede i menuen og tilpasse størrelsen en smule
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester