[JS] Menu werkt niet onder Firefox

[r0b]

Voor mijn vriendin ben ik even een pagina aan het fixen, en voor wat dat betreft is dit gelukt (positie van uitvouw-menu veranderen),
maar wat mij stoort is dat de pagina alleen werkt in IE6 en niet onder Mozilla Firefox 1.0

Het gaat dan (voornamelijk) om de volgende deel code:

code:

<Div ID='GeneralMenuA' STYLE="position:absolute;LEFT:1pt;TOP:110pt;">
    <table border="0" cellspacing='0' cellpadding='0'>
    <tr>
        <td>
            <table width="52" border="0" cellspacing="0" cellpadding="0">
            <tr><td>[img]"_img/z.gif"[/img]</td></tr>
            <tr>
                <td valign="bottom">[img]"_img/arrow_menu_right.gif"[/img]</td>
            </tr>
            </table>
        </td>
        <td>
            <table width="270" height="250" border="0" cellspacing="0" cellpadding="0" background="_img/menu_bg.gif">
            <tr><td valign="top">[img]"_img/pap_menu1_top.gif"[/img]</td></tr>
                       <tr><td colspan=2 ><a class="menu_main" href='?open=zabl_index' onmouseover="imgMenuA(3,1);subrolln(1,1);this.style.backgroundColor = '#C58535';return true" ONMOUSEOUT="imgMenuA(1,0);subrolln(0,1);this.style.backgroundColor= ''; return true;">&nbsp;&nbsp;&#1047;&#1072;&#1073;&#1086;&#1083;&#1077;&#1074;&#1072;&#1085;&#1080;&#1103;</a></td></tr>
            <tr><td colspan=2 ><a class="menu_main" href='?open=weed' onmouseover="imgMenuA(2,1);subrolln(1,1);this.style.backgroundColor = '#C58535';" ONMOUSEOUT="imgMenuA(2,0);subrolln(0,1);this.style.backgroundColor= '';">&nbsp;&nbsp;&#1058;&#1088;&#1072;&#1074;&#1099;
                &#1080; &#1084;&#1091;&#1084;&#1080;&#1105;</a></td></tr>
            <tr><td><a class="menu_main" href='?open=vitamins'  onmouseover="imgMenuA(1,1);subrolln(1,1);this.style.backgroundColor = '#C58535';" ONMOUSEOUT="imgMenuA(3,0);subrolln(0,1);this.style.backgroundColor= '';">&nbsp;&nbsp;&#1042;&#1080;&#1090;&#1072;&#1084;&#1080;&#1085;&#1099;
                &#1080; &#1084;&#1080;&#1085;&#1077;&#1088;&#1072;&#1083;&#1100;&#1085;&#1099;&#1077; &#1074;&#1077;&#1097;&#1077;&#1089;&#1090;&#1074;&#1072;</a></td></tr>
            <tr><td><a class="menu_main" href='#' onmouseover="imgMenuA(2,1);subrolln(1,1);this.style.backgroundColor = '#C58535';" ONMOUSEOUT="imgMenuA(3,0);subrolln(0,1);this.style.backgroundColor= '';">&nbsp;&nbsp;&#1092;&#1088;&#1080;&#1075;&#1080;&#1076;&#1085;&#1086;&#1089;&#1090;&#1100;
                &#1080;&#1084;&#1087;&#1086;&#1090;&#1077;&#1085;&#1094;&#1080;&#1103;</a></td></tr>
            <tr><td><a class="menu_main" href='#' onmouseover="imgMenuA(2,1);subrolln(1,1);this.style.backgroundColor = '#C58535';" ONMOUSEOUT="imgMenuA(3,0);subrolln(0,1);this.style.backgroundColor= '';">&nbsp;&nbsp;&#1053;&#1086;&#1088;&#1084;&#1072;&#1083;&#1080;&#1079;&#1072;&#1094;&#1080;&#1103;
                &#1089;&#1077;&#1082;&#1089;&#1091;&#1072;&#1083;&#1100;&#1085;&#1099;&#1093; &#1086;&#1090;&#1085;&#1086;&#1096;&#1077;&#1085;&#1080;&#1081;</a></td></tr>
            <tr><td><a class="menu_main" href='#' onmouseover="imgMenuA(2,1);subrolln(1,1);this.style.backgroundColor = '#C58535';" ONMOUSEOUT="imgMenuA(3,0);subrolln(0,1);this.style.backgroundColor= '';">&nbsp;&nbsp;&#1050;&#1086;&#1076;&#1080;&#1088;&#1086;&#1074;&#1072;&#1085;&#1080;&#1077;
                &#1086;&#1090; &#1082;&#1091;&#1088;&#1077;&#1085;&#1080;&#1103;</a></td></tr>
            <tr><td><a class="menu_main" href='?open=zarad_water' onmouseover="imgMenuA(2,1);subrolln(1,1);this.style.backgroundColor = '#C58535';" ONMOUSEOUT="imgMenuA(3,0);subrolln(0,1);this.style.backgroundColor= '';">&nbsp;&nbsp;&#1047;&#1072;&#1088;&#1103;&#1078;&#1077;&#1085;&#1080;&#1077;
                &#1074;&#1086;&#1076;&#1099; &#1080; &#1076;&#1088;&#1091;&#1075;&#1080;&#1093; &#1074;&#1077;&#1097;&#1077;&#1089;&#1090;&#1074;</a></td></tr>
            <tr><td valign="bottom">[img]"_img/pap_menu1_bottom.gif"[/img]</td></tr>
            
            
            </table>
        </td>
        <td>
        <table width="52" border="0" cellspacing="0" cellpadding="0">
        <tr><td>[img]"_img/z.gif"[/img]</td></tr>
        <tr>
            <td valign="bottom">[img]"_img/arrow_menu_left.gif"[/img]</td>
        </tr>
        </table>
      </td>
    </tr>
    </table>
</Div>

Nu heb ik gezocht op 'menu firefox explorer javascript' en soortgelijke termen, echter, hier heb ik weinig op terug kunnen vinden.
Verder heb ik de pagina door de w3c html validator gehaald, en waar nodig dingen aangepast.
Het enige dat nog niet validated werkt is de leftmargin= tag, maar om dat te fixen moet ik de hele pagina verbouwen.
Verder lijkt mij dit niet van invloed op het niet werken van het menu onder Firefox.

Het probleem is dus dat het menu niet 'uitvouwt' onder Firefox 1.0, terwijl hij dit wel doet onder IE6.

Ik ben geen grote HTML/JavaScript held, maar met logisch nadenken kom ik redelijk ver.
Dit gaat dit keer helaasch dus niet op.

De pagina valt hier ook te bekijken, wil je het checken: hier

Even wat specificaties:
WinXP Home SP1
Mozilla Firefox 1.0
Internet Explorer 6.0
Kerio Personal Firewall 4

[ Voor 120% gewijzigd door r0b op 28-11-2004 01:16 ]

[Tyrian]

Ik vind het sowieso een akelig menu, want als er een menu uitklapt dan bedekt het de andere menu's, waardoor je niet snel door de menu's kunt browsen. Erg frustrerend.

[r0b]

Tyrian schreef op zondag 28 november 2004 @ 01:09:
Ik vind het sowieso een akelig menu, want als er een menu uitklapt dan bedekt het de andere menu's, waardoor je niet snel door de menu's kunt browsen. Erg frustrerend.

Ben ik ook volledig met je eens.
Maar als een vrouw éénmaal iets in haar hoofd heeft ..

Dit is dus wel wat ze wil. ( Ja, ik heb er zelf ook een pesthekel aan (het menu). )

[ Voor 3% gewijzigd door r0b op 28-11-2004 01:10 ]

[Tyrian]

Als je ze naar onder laat uitvouwen, dan zou je ze eigenlijk naast elkaar, bovenaan de pagina moeten zetten. dan werkt het wel mooi.

[r0b]

Tyrian schreef op zondag 28 november 2004 @ 01:12:
Als je ze naar onder laat uitvouwen, dan zou je ze eigenlijk naast elkaar, bovenaan de pagina moeten zetten. dan werkt het wel mooi.

Mjah, of (zoals het default zou zijn) naast het bestaande menu.
Maar dat wil ze dus niet (vraag me niet waarom niet, ik zou het bij god niet weten).

En ach, mocht ze dit later toch anders willen dan kan ik het zo nog veranderen.
Het probleem hier is het niet werken onder Firefox/IE6.

[r0b]

Ik zie net pas dat Firefox ook een JavaScript console heeft.

Deze geeft het volgende aan:

Error: document.layers has no properties
Source File: http://www.kriteon.com/leosong/www/_misc/_js/script.js
Line: 769

En het relevante deel rondom line 769:

code:

function hideLayer(layerName){

    if (NS4 || IE4) {

        eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"');

    }   

}

(De eval(layerRef+ line is line 769.)

edit:
Excuses, deze had ook in de bovenstaande post gekunt.

---

edit:
Update

Na het goed bekijken van script.js waar maar éénmaal document.layers in voorkomt, klopt het inderdaad wel dat hij niet werkt.
Deze geeft namelijk het volgende aan:

code:

    if (NS4 || IE4) {

        if (navigator.appName == "Netscape") {

                                layerStyleRef="layer.";

                                layerRef="document.layers";

                                styleSwitch="";

        }else{

                                layerStyleRef="layer.style.";

                                layerRef="document.all";

                                styleSwitch=".style";

                    }

            }

Dat lijkt me inderdaad niet te gaan werken.

---

edit:
Update

Het werkt!

Ik heb ipv layerRef="document.layers" in dit geval gewoon maar "document.all" gebruikt en de styleSwitch voor NS4 naar .style gezet, net als het geval is bij IE.

Dit lostte het probleem op.
Ik had het probleem dus zelf op kunnen lossen, als ik vantevoren wist dat er een JavaScript Console in Firefox zat.

[ Voor 116% gewijzigd door r0b op 28-11-2004 03:02 ]