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

javascript horizontaal dropdown menu

webgek
3 antwoorden
  • :D Hallo Allemaal,

    Kan iemand mij vertellen hoe je in onderstaand javascript aan moet geven waar de html pagina's op je homepage staan.

    Of misschien heeft iemand een beter script?

    Het is de bedoeling dat als ik op woonhuisventilatie druk de pagina in het onderste frame van mijn homepage komt.
    hier gaat het niet goed:
    ("link2", "WOONHUISVENTILATIE", " ", "http://home.casema.nl
    exhunt/individuelevent.htm/");

    Hier is het javascript wat ik gebruik.
    <html>

    <head>
    <style>
    all.clsMenuItemNS{font: bold x-small Verdana; color: white; text-decoration: none;}
    .clsMenuItemIE{text-decoration: none; font: bold xx-small Verdana; color: white; cursor: hand;}
    A:hover {color: blue;}
    </style>
    <script language="JavaScript">if (document.all) {n=0;ie=1;fShow="visible";fHide="hidden";}
    if (document.layers) {n=1;ie=0;fShow="show"; fHide="hide";}

    window.onerror=new Function("return true")
    rightX = 0;
    function Menu()
    {
    this.bgColor = "#3333cc";
    if (ie) this.menuFont = "bold xx-small Verdana";
    if (n) this.menuFont = "bold x-small Verdana";
    // this.fontColor = "white";

    this.addItem = addItem;
    this.addSubItem = addSubItem;
    this.showMenu = showMenu;
    this.mainPaneBorder = 0;
    this.subMenuPaneBorder = 0;

    this.subMenuPaneWidth = 120;

    lastMenu = null;

    rightY = 0;
    leftY = 0;
    leftX = 0;

    HTMLstr = "";
    HTMLstr += "<!– MENU PANE DECLARATION BEGINS –>
    ";
    HTMLstr += "
    ";
    if (ie) HTMLstr += "<div id='MainTable' style='position:relative'>
    ";
    // if (n) HTMLstr += "<layer name='MainTable'>
    ";
    HTMLstr += "<table width='100%' bgcolor='"+this.bgColor+"' border='"+this.mainPaneBorder+"'>
    ";
    HTMLstr += "<tr>";
    if (n) HTMLstr += "<td> ";
    HTMLstr += "<!– MAIN MENU STARTS –>
    ";
    HTMLstr += "<!– MAIN_MENU –>
    ";
    HTMLstr += "<!– MAIN MENU ENDS –>
    ";
    if (n) HTMLstr += "</td>";
    HTMLstr += "</tr>
    ";
    HTMLstr += "</table>
    ";
    HTMLstr += "
    ";
    HTMLstr += "<!– SUB MENU STARTS –>
    ";
    HTMLstr += "<!– SUB_MENU –>
    ";
    HTMLstr += "<!– SUB MENU ENDS –>
    ";
    HTMLstr += "
    ";
    if (ie) HTMLstr+= "</div>
    ";
    // if (n) HTMLstr+= "</layer>
    ";
    HTMLstr += "<!– MENU PANE DECALARATION ENDS –>
    ";
    }

    function addItem(idItem, text, hint, location, altLocation)
    {
    var Lookup = "<!– ITEM "+idItem+" –>";
    if (HTMLstr.indexOf(Lookup) != -1)
    {
    alert(idParent + " already exist");
    return;
    }
    var MENUitem = "";
    MENUitem += "
    <!– ITEM "+idItem+" –>
    ";
    if (n)
    {
    MENUitem += "<ilayer name="+idItem+">";
    MENUitem += "<a href='.' class=clsMenuItemNS onmouseover=\"displaySubMenu('"+idItem+"')\" onclick=\"return false;\">";
    MENUitem += "| ";
    MENUitem += text;
    MENUitem += "</a>";
    MENUitem += "</ilayer>";
    }
    if (ie)
    {
    MENUitem += "<td>
    ";
    MENUitem += "<div id='"+idItem+"' style='position:relative; font: "+this.menuFont+";'>
    ";
    MENUitem += "<a ";
    MENUitem += "class=clsMenuItemIE ";
    // MENUitem += "style='text-decoration: none; font: "+this.menuFont+"; color: "+this.fontColor+"; cursor: hand;' ";
    if (hint != null)
    MENUitem += "title='"+hint+"' ";
    if (location != null)
    {
    MENUitem += "href='"+location+"' ";
    MENUitem += "onmouseover=\"hideAll()\" ";
    }
    else
    {
    if (altLocation != null)
    MENUitem += "href='"+altLocation+"' ";
    else
    MENUitem += "href='.' ";
    MENUitem += "onmouseover=\"displaySubMenu('"+idItem+"')\" ";
    MENUitem += "onclick=\"return false;\" "
    }
    MENUitem += ">";
    MENUitem += "|
    ";
    MENUitem += text;
    MENUitem += "</a>
    ";
    MENUitem += "</div>
    ";
    MENUitem += "</td>
    ";
    }
    MENUitem += "<!– END OF ITEM "+idItem+" –>

    ";
    MENUitem += "<!– MAIN_MENU –>
    ";

    HTMLstr = HTMLstr.replace("<!– MAIN_MENU –>
    ", MENUitem);
    }

    function addSubItem(idParent, text, hint, location)
    {
    var MENUitem = "";
    Lookup = "<!– ITEM "+idParent+" –>";
    if (HTMLstr.indexOf(Lookup) == -1)
    {
    alert(idParent + " not found");
    return;
    }
    Lookup = "<!– NEXT ITEM OF SUB MENU "+ idParent +" –>";
    if (HTMLstr.indexOf(Lookup) == -1)
    {
    if (n)
    {
    MENUitem += "
    ";
    MENUitem += "<layer id='"+idParent+"submenu' visibility=hide bgcolor='"+this.bgColor+"'>
    ";
    MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">
    ";
    MENUitem += "<!– NEXT ITEM OF SUB MENU "+ idParent +" –>
    ";
    MENUitem += "</table>
    ";
    MENUitem += "</layer>
    ";
    MENUitem += "
    ";
    }
    if (ie)
    {
    MENUitem += "
    ";
    MENUitem += "<div id='"+idParent+"submenu' style='position:absolute; visibility: hidden; width: "+this.subMenuPaneWidth+"; font: "+this.menuFont+"; top: -300;'>
    ";
    MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">
    ";
    MENUitem += "<!– NEXT ITEM OF SUB MENU "+ idParent +" –>
    ";
    MENUitem += "</table>
    ";
    MENUitem += "</div>
    ";
    MENUitem += "
    ";
    }
    MENUitem += "<!– SUB_MENU –>
    ";
    HTMLstr = HTMLstr.replace("<!– SUB_MENU –>
    ", MENUitem);
    }

    Lookup = "<!– NEXT ITEM OF SUB MENU "+ idParent +" –>
    ";
    if (n) MENUitem = "<tr><td><a class=clsMenuItemNS title='"+hint+"' href='"+location+"'>"+text+"</a><br></td></tr>
    ";
    if (ie) MENUitem = "<tr><td><a class=clsMenuItemIE title='"+hint+"' href='"+location+"'>"+text+"</a><br></td></tr>
    ";
    MENUitem += Lookup;
    HTMLstr = HTMLstr.replace(Lookup, MENUitem);

    }

    function showMenu()
    {
    document.writeln(HTMLstr);
    }

    function displaySubMenu(idMainMenu)
    {
    var menu;
    var submenu;
    if (n)
    {
    submenu = document.layers[idMainMenu+"submenu"];
    if (lastMenu != null && lastMenu != submenu) hideAll();
    submenu.left = document.layers[idMainMenu].pageX;
    submenu.top = document.layers[idMainMenu].pageY + 25;
    submenu.visibility = fShow;

    leftX = document.layers[idMainMenu+"submenu"].left;
    rightX = leftX + document.layers[idMainMenu+"submenu"].clip.width;
    leftY = document.layers[idMainMenu+"submenu"].top+
    document.layers[idMainMenu+"submenu"].clip.height;
    rightY = leftY;
    } else if (ie) {
    menu = eval(idMainMenu);
    submenu = eval(idMainMenu+"submenu.style");
    submenu.left = calculateSumOffset(menu, 'offsetLeft');
    // submenu.top = calculateSumOffset(menu, 'offsetTop') + 30;
    submenu.top = menu.style.top+23;
    submenu.visibility = fShow;
    if (lastMenu != null && lastMenu != submenu) hideAll();

    leftX = document.all[idMainMenu+"submenu"].style.posLeft;
    rightX = leftX + document.all[idMainMenu+"submenu"].offsetWidth;

    leftY = document.all[idMainMenu+"submenu"].style.posTop+
    document.all[idMainMenu+"submenu"].offsetHeight;
    rightY = leftY;
    }
    lastMenu = submenu;
    }

    function hideAll()
    {
    if (lastMenu != null) {lastMenu.visibility = fHide;lastMenu.left = 0;}
    }

    function calculateSumOffset(idItem, offsetName)
    {
    var totalOffset = 0;
    var item = eval('idItem');
    do
    {
    totalOffset += eval('item.'+offsetName);
    item = eval('item.offsetParent');
    } while (item != null);
    return totalOffset;
    }

    function updateIt(e)
    {
    if (ie)
    {
    var x = window.event.clientX;
    var y = window.event.clientY;

    if (x > rightX || x < leftX) hideAll();
    else if (y > rightY) hideAll();
    }
    if (n)
    {
    var x = e.pageX;
    var y = e.pageY;

    if (x > rightX || x < leftX) hideAll();
    else if (y > rightY) hideAll();
    }
    }

    if (document.all)
    {
    document.body.onclick=hideAll;
    document.body.onscroll=hideAll;
    document.body.onmousemove=updateIt;
    }
    if (document.layers)
    {
    document.onmousedown=hideAll;
    window.captureEvents(Event.MOUSEMOVE);
    window.onmousemove=updateIt;
    }</script>
    <script language="JavaScript">function showToolbar()
    {
    // AddItem(id, text, hint, location, alternativeLocation);
    // AddSubItem(idParent, text, hint, location);

    menu = new Menu();
    menu.addItem("link1", "HOME", "HOME", null, null);
    menu.addItem("link2", "VENTILATIETECHNIEK", "VENTILATIETECHIEK", null, null);
    menu.addItem("link3", "RIOOLTECHNIEK", "RIOOLTECHNIEK", null, null);
    menu.addItem("link4", "ELECTROTECHNIEK", "ELECTROTECHNIEK", null, null);
    menu.addItem("link5", "CONTACT", "CONTACT", null, null);

    menu.addSubItem("link2", "ALGEMEEN", "", "http://home.casema.nl
    exhunt/");
    menu.addSubItem("link2", "WOONHUISVENTILATIE", " ", "http://home.casema.nl
    exhunt/individuelevent.htm/");
    menu.addSubItem("link2", "COLLECTIEVE VENTILATIE", "", "http://home.casema.nl
    exhunt/");


    menu.addSubItem("link3", "ALGEMEEN", "", "http://home.casema.nl
    exhunt/");
    menu.addSubItem("link3", "ONTSTOPPEN", "", "http://home.casema.nl
    exhunt/");
    menu.addSubItem("link3", "VERNIEUWEN", "", "http://home.casema.nl
    exhunt/");


    menu.addSubItem("link4", "ELECTROTECHNIEK", "ELECTROTECHNIEK", "http://home.casema.nl
    exhunt/");


    menu.addSubItem("link5", "CONTACT", "CONTACT", "http://home.casema.nl
    exhunt/");

    menu.showMenu();
    }
    </script>
    <script
    language="JavaScript">
    showToolbar();
    </script>
    <script language="JavaScript">
    function UpdateIt(){
    if (document.all){
    document.all["MainTable"].style.top = document.body.scrollTop;
    setTimeout("UpdateIt()", 200);}}
    UpdateIt();
    </script>
    <base target="_blank">
    <meta http-equiv="Content-Language" content="nl">
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>MENUBALK</title>
    <base target="onder">
    </head>

    <body bgcolor="#EEEAF2">
    </body>

    </html>
  • [quote:b46d514a3f="Rex Hunt"]
    hier gaat het niet goed:
    ("link2", "WOONHUISVENTILATIE", " ", "http://home.casema.nl
    exhunt/individuelevent.htm/");
    [/quote:b46d514a3f]Misschien wel te simpel (het is toch alweer 1 uur, en ik heb ook geen zin om die lap code door te spitten ;)), maar haal de laatste '/' eens weg. Dus:[code:1:b46d514a3f]("link2", "WOONHUISVENTILATIE", " ", "http://home.casema.nl
    exhunt/individuelevent.htm");[/code:1:b46d514a3f]
  • menu.addSubItem("link2", "WOONHUISVENTILATIE", " ", "http://home.casema.nl
    exhunt/individuelevent.htm/", [b:ba298a12c8]"naam_van_frame"[/b:ba298a12c8]);

Beantwoord deze vraag

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