Op deze website gebruiken we cookies om content en advertenties te personaliseren, om functies voor social media te bieden en om ons websiteverkeer te analyseren. Ook delen we informatie over uw gebruik van onze site met onze partners voor social media, adverteren en analyse. Deze partners kunnen deze gegevens combineren met andere informatie die u aan ze heeft verstrekt of die ze hebben verzameld op basis van uw gebruik van hun services. Meer informatie.

Akkoord

Vraag & Antwoord

Webprogrammeren & scripting

Probleem met Javascript menu

Robertstam
7 antwoorden
  • Ik heb een menu, dat bestaat uit 5 frames. In elk frame staat een stuk van het menu in javascript. Het script hoort het volgende menu'tje te geven. http://home.planet.nl/~stam0272/1.php Tot zo ver gaat het goed.

    Nu probeer ik de frames samen te voegen tot een frame, omdat dat handiger is voor de site. Maar wat ik ook probeer, er werkt maar een deel van het menu'tje of helemaal geen.
    (http://home.planet.nl/~stam0272/mislukt1.php of http://home.planet.nl/~stam0272/mislukt2.php)

    Hier is nog de hele code van de site http://home.planet.nl/~stam0272/code.htm voor het geval jullie die willen weten.

    Ik heb er al uren aan gezeten en ben niks verder gekomen. :cry: Ik hoop dat jullie nog tips/suggesties hebben. bvd Robert.
  • Excuses voor de enorme brok met code, maar hieronder heb ik je code (uit mislukt2.php) wat aangepast.
    Even wat opmerkingen: het ging dus fout omdat je dezelfde functie aanroept voor beide menu-layers zonder deze andere parameters te geven. Bovendien werk je ontzettend veel met globale variabelen en dat komt de overzichtelijkheid niet ten goede.
    Mijn advies is: kijk even naar de code en de reden waarom het nu wel werkt en begin daarna helemaal overnieuw. Trust me, je zal me later dankbaar zijn.

    [code:1:5aba8a8186]
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    body{font-family:tahoma;font-size:10pt}
    A:hover{color:white;font-weight:bold}
    a{text-decoration:none}
    </style>


    <script language="JavaScript" type="text/JavaScript">
    <!–

    function SymError()
    {
    return true;
    }

    window.onerror = SymError;

    //–>
    </script>
    <script language="JavaScript" type="text/JavaScript">
    var menu_pos=0;
    var menu_speed=5;
    var instant_close=0;

    if (menu_speed > 10)
    {
    menu_speed=10;
    }
    if(document.all)
    {
    doc = "document.all";
    sty = ".style";
    htm = ""
    }
    else if(document.layers)
    {
    doc = "document";
    sty = "";
    htm = ".document"
    }

    function positionLayer(lyr,leftpos)
    {
    lyrObj = eval(doc + '["' + lyr + '"]' + sty);
    lyrObj.left = leftpos;
    if(menu_pos==0)
    {
    lyrObj.top = -80;
    }
    else
    {
    lyrObj.top = 2;
    }
    }
    function positionLayers()
    {
    positionLayer('abcLyr',100);
    positionLayer('bcLyr',220);
    }
    function pullitup(lyr)
    {
    if (window.dropdown)
    {
    clearInterval(dropdown)
    }
    pullup=setInterval("uplift('" + lyr + "')", 1)
    }
    function dropitdown(lyr)
    {
    if (window.pullup)
    {
    clearInterval(pullup)
    }
    dropdown=setInterval("downlift('" + lyr + "')", 1)
    }
    function uplift(lyr)
    {
    var lyrObj = eval(doc + '["' + lyr + '"]' + sty);
    var x_pos1 = parseInt(lyrObj.top);
    if(x_pos1 >= -78 )
    {
    if(instant_close==1)
    {
    lyrObj.top=-0;
    }
    else if(instant_close==0)
    {
    lyrObj.top = x_pos1-menu_speed;
    }
    }
    else if (window.pullup)
    {
    clearInterval(pullup);
    }
    }
    function downlift(lyr)
    {
    var lyrObj = eval(doc + '["' + lyr + '"]' + sty);
    var x_pos1 = parseInt(lyrObj.top);
    if(x_pos1 < 0 )
    {
    lyrObj.top = x_pos1+menu_speed;
    }
    else if (window.dropdown)
    {
    clearInterval(dropdown);
    }
    }
    function info()
    {
    alert("This is a script");
    }
    </script>

    </head>

    <body bgcolor="#666666" text="#00FF00" link="#CCFFCC" vlink="#008000" alink="#FFFFFF" leftmargin="15" topmargin="25" rightmargin="15" onload="positionLayers();">

    <div id="abcLyr" style="position: absolute; left: 100px; top: -80px; width: 125px; height: 103px; z-index: 100; visibility: visible" onmouseover="dropitdown('abcLyr')" onmouseout="pullitup('abcLyr')">
    <table bgcolor="#404040" width="120" height="100" border="0" bordercolor="#008000" background="../Mijn%20documenten/Mentorsite/menu.gif" bordercolordark="#000000" bordercolorlight="#000033" cellspacing="0">
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="http://members.lycos.nl/mentorsite/index.php" target="mainFrame"><font color="#FFFFFF" size="1">Cor's
    index</font></a></div></td>
    </tr>
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="../Mijn%20documenten/Mentorsite/mainframe.php" target="mainFrame"><font color="#FFFFFF" size="1">Home</font></a></div></td>
    </tr><tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="http://members.lycos.nl/mentorsite/Scripts/werkverdeling.php" target="mainFrame"><font color="#FFFFFF" size="1">Werkverdeling</font></a></div></td>
    </tr>
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="#"><font color="#FFFFFF" size="1">Menu
    item 3</font></a></div></td>
    </tr>
    <tr>
    </tr>
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="#"><font color="#FFFFFF" size="1">Blader
    door de site</font></a></div></td>
    </tr>
    <!–<tr><td align="center" valign="bottom"><font size="-2"><b>Menu &</b> <a href="javascript:void(0)" onclick="downlift()"><b>Show</b></a> <b>/</b> <a href="javascript:void(0)" onclick="uplift()"><b>Hide</b></a></font></td></tr>–>
    </table>
    </div>

    <div id="bcLyr" style="position: absolute; left: 220px; top: -80px; width: 125px; height: 103px; z-index: 100; visibility: visible" onmouseover="dropitdown('bcLyr')" onmouseout="pullitup('bcLyr')">
    <table bgcolor="#404040" width="120" height="100" border="0" bordercolor="#008000" background="../Mijn%20documenten/Mentorsite/menu.gif" bordercolordark="#000000" bordercolorlight="#000033" cellspacing="0">
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="#"><font color="#FFFFFF" size="1">Menu
    item 1</font></a></div></td>
    </tr>
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="#"><font color="#FFFFFF" size="1">Menu
    item 2</font></a></div></td>
    </tr>
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="#"><font color="#FFFFFF" size="1">Menu
    item 3</font></a></div></td>
    </tr>
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="#"><font color="#FFFFFF" size="1">Menu
    item 4</font></a></div></td>
    </tr>
    <tr>
    <td align="center" valign="middle" nowrap><div align="left"><a href="#"><font color="#FFFFFF" size="1">Menu
    2</font></a></div></td>
    </tr>
    <!–<tr><td align="center" valign="bottom"><font size="-2"><b>Menu &</b> <a href="javascript:void(0)" onclick="downlift()"><b>Show</b></a> <b>/</b> <a href="javascript:void(0)" onclick="uplift()"><b>Hide</b></a></font></td></tr>–>
    </table>
    </div>
    </body>
    </html>[/code:1:5aba8a8186]
  • JEEEEEEEJ, het werkt. :D Heel hartelijk bedankt voor de moeite. Ik zal het goed gaan bekijken, want ik moet de andere frames er ook nog bij doen. Nogmaals bedankt!!!

    P.S. ik heb die code niet zelf in elkaar geknutseld, maar een vriend van mij had hem ergens vandaan gehaald.
  • Het menu'tje werkt nu wel op de manier zoals het hoort te werken, maar alleen als je na de downlift van het menu met je muis naar rechts beweegt, gaat het menu'tje niet omhoog. (zie deze site: http://members.lycos.nl/mentorsite/ de inhoud doet er even niet toe :wink: ) Hoe zou ik dat moeten veranderen, of kan dat niet met dit script?

    Bvd, en alvast bedankt voor de moeite.
  • Als je bij een onmouseover van een menu-item eerst een functie uitvoert die alle (dan hoef je namelijk niet te bij te houden welke er geopend is) menu-items sluit ben je waar je wil zijn.

    De functie om te sluiten heb je al, deze roep je namelijk aan bij een onmouseout van het uitgeklapte menu.
  • Ik moet eerlijk gezegd toegeven dat ik er niet uitkom. Hoogstwaarschijnlijk omdat ik nooit een cursusje heb gevolgd. Ik snap best dat jullie er geen zin in hebben om voor iedereen een script te gaan schrijven. Daarom zou ik graag willen weten wat een goede javascriptcursus is, waar het voornamelijk gaat om menu's maken. Ik heb zelf wel wat gezocht, maar niet echt wat gevonden.

    Tips voor boeken zijn ook welkom en natuurlijk mag je het script ook ff voor me aanpassen :P :wink: als je nog tijd over hebt.
  • [quote:bacd4f661f="Robertstam"]als je nog tijd over hebt.[/quote:bacd4f661f]Een IT-er met tijd over is een contradictio in terminis ;)

Beantwoord deze vraag

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.