Avatar billede webcreator Nybegynder
04. oktober 2003 - 23:50 Der er 16 kommentarer og
1 løsning

Optimering af menu til andre browsere

Hej.

Jeg har en drop-down menu baseret på Layers og JavaScript. Desværre virker den ikke i andet end IE - og ret dårligt i Mozilla.

Jeg paster nedenfor al min JS kode. Så håber jeg, at der er en der gider optimere den :)

- Tak

Koden : http://jemt.frac.dk/menu.txt
Avatar billede webcreator Nybegynder
04. oktober 2003 - 23:51 #1
Sig til hvis jeg er for nærig :)
Avatar billede skovenborg Nybegynder
04. oktober 2003 - 23:56 #2
Har du en side hvor du bruger den - bare som et eksempel. Det kunne gøre det lidt lettere at se problemmet ;-)
Avatar billede webcreator Nybegynder
05. oktober 2003 - 00:15 #3
Avatar billede webcreator Nybegynder
05. oktober 2003 - 00:31 #4
Kan det bruges ?
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 00:42 #5
problemmet med at hvis du går ind under Services og Postsystem, kommer undermenuen til at ligge helt til venstre. Dette kan løses ved at ændre på menuOpen():

function menuOpen(objMenu, objParentMenuItem)
{
    if(menuOpenList.length) {
        var objParentMenu = menuOpenList[menuOpenList.length-1];
        objMenu.style.left = parseInt(objParentMenu.style.left) + objParentMenuItem.offsetWidth*2/3;
        objMenu.style.top = parseInt(objParentMenu.style.top) +  objParentMenuItem.offsetTop-1;
    }
    else
    {
        objMenu.style.left = objParentMenuItem.offsetLeft-1;
        objMenu.style.top = objParentMenuItem.offsetHeight+1;
    }
    objMenu.style.visibility = 'visible';
    menuOpenList.push(objMenu);
}
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 00:47 #6
filtrene i din css virker dog heller ikke i mozilla (filtrene er sådan set heller ikke rigtig css). Du kan så evt. skrive:
div.divmenu {
    filter: blendTrans(duration=0.2) alpha(style=0, opacity=85);
    -moz-opacity:0.85;
    visibility: hidden;
    position: absolute;
}

Giver bare ikke den helt samme effekt, men du kan jo prøve at lege lidt med det.
Avatar billede webcreator Nybegynder
05. oktober 2003 - 00:50 #7
Skovenborg > Virker helt perfekt. Mange tak.

Men moz-opacity ser ret dårlig ud. Hvordan vil du foreslå at jeg kan "lege" med den ? Kan jeg ændre lidt i farverne for det lag den bruger ?
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 00:50 #8
Forresten virker cursor:hand; heller ikke i mozilla (igen er dog noget Microsoft selv har fundet på, og derfor er det ikke valid css).

Du skal derfor ændre det til:
cursor:pointer;
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 00:52 #9
tjaa, jeg tænkte du kunne ændre lidt på -moz-opacity. Fx sæt den til 0.70 eller deromkring, så ser det cirka sådan ud som det gør i IE.

Smider lige et svar imens ;-)
Avatar billede webcreator Nybegynder
05. oktober 2003 - 00:59 #10
Tak for svaret :)

Men nej - den gennemsigtige effekt er nærmest rød/brun
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 01:03 #11
tja, jeg syntes ellers de så meget ens ud.
Men måske er jeg bare begyndt at blive lidt træt ;-)
Avatar billede webcreator Nybegynder
05. oktober 2003 - 01:03 #12
Hehe :)
Men kan man ændre lidt på den farve, som den gør sig gennemsigtig med ? (håber du forstår)
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 01:05 #13
...men jeg kan godt se at teksten bliver lidt mat af det.
Avatar billede webcreator Nybegynder
05. oktober 2003 - 01:12 #14
Anyways. Mange tak for hjælpen :)
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 01:16 #15
Du kan i hvert fald ændre det med den mærkelige tekst, sådan (lidt bøvet, men det var det eneste jeg kunne få til at virke på denne tid af natten ;-)

<tr><td class="menuItem" onmouseout="menuOut(this)" id="service2" onmouseover="menuOver(this)" onclick="java script:update('side=msg&function=inbox');"><span style="-moz-opacity:1.1;">Inbox</span></td></tr>
Avatar billede skovenborg Nybegynder
05. oktober 2003 - 01:16 #16
og takker for point :-)
Avatar billede webcreator Nybegynder
05. oktober 2003 - 01:22 #17
Vil jeg prøve så. Tak igen :)
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