perlunity.de | Javascript : Navigationen - statisches Menu 2 | Die Community für Perl PHP CGI Apache MySQL und Javascript

perlunity.de - PERL | JAVASCRIPT | PHP | MySQL | APACHE


	#!/COMMUNITY Members: 5374 davon online: 1 weitere User: 32

12.02.2012 / 10:24

Community-Member werden | Paßwort vergessen | OnlineMonitor (1)

Wer ist online ... OnlineMonitor starten !

Javascript » Navigationen » statisches Menu 2
zur Übersicht

Kategorie Navigationen

Bezeichnung statisches Menu 2

ScriptDemo Neues Fenster für Demo öffnen

Statistik 47754 Aufrufe davon 0x gestern

Funktioniert mit IE4+, NS4, NS6+, Opera6, aber nicht hier wg. widersprechenden StyleSheets. Aus dem Quelltext alles von bis übernehmen und es funktioniert!

Javascript-Quellcode (einfach markieren, kopieren und lokal abspeichern)

 <html> <head> <style> all.clsMenuItemNS, .clsMenuItemIE{text-decoration: none; font: bold 12px Arial; color: white; cursor: hand; z-index:100} #MainTable A:hover {color: yellow;} </style> <script language="JavaScript"> //Top Nav Bar I v2- By Constantin Kuznetsov Jr. (script@esolutiononline.com) var keepstatic=1 //specify whether menu should stay static 0=non static (works only in IE4+) var menucolor="#000000" //specify menu color var submenuwidth=150 //specify sub menus' color </script> <title>Welcome to Homepage</title> </head> <body marginwidth="0" marginheight="0" leftmargin="0" topmargin="0"> <script language="JavaScript"> if (document.all) {n=0;ie=1;ns6=0;fShow="visible";fHide="hidden";} if (document.getElementById&&!document.all) {n=0;ie=0;ns6=1;fShow="visible";fHide="hidden";} if (document.layers) {n=1;ie=0;ns6=0;fShow="show";fHide="hide";} //Top Nav bar script v2- http://www.dynamicdrive.com/dynamicindex1/sm/index.htm opr6=ie&&navigator.userAgent.indexOf("Opera")!=-1 //window.onerror=new Function("return true") //////////////////////////////////////////////////////////////////////////// // Function Menu() // //////////////////////////////////////////////////////////////////////////// rightX = 0; function Menu() { this.bgColor = menucolor; if (ie) this.menuFont = "bold 12px Arial"; if (n) this.menuFont = "bold 12px Verdana"; this.fontColor = "black"; this.addItem = addItem; this.addSubItem = addSubItem; this.showMenu = showMenu; this.mainPaneBorder = 0; this.subMenuPaneBorder = 0; this.subMenuPaneWidth = submenuwidth; lastMenu = null; rightY = 0; leftY = 0; leftX = 0; HTMLstr = ""; HTMLstr += "\n"; HTMLstr += "\n"; if (ie||ns6) HTMLstr += "<div id='MainTable' style='position:relative;top:0'>\n"; // if (n) HTMLstr += "<layer name='MainTable'>\n"; HTMLstr += "<table width='100%' bgcolor='"+this.bgColor+"' border='"+this.mainPaneBorder+"'>\n"; HTMLstr += "<tr>"; if (n) HTMLstr += "<td> "; HTMLstr += "\n"; HTMLstr += "\n"; HTMLstr += "\n"; if (n) HTMLstr += "</td>"; HTMLstr += "</tr>\n"; HTMLstr += "</table>\n"; HTMLstr += "\n"; HTMLstr += "\n"; HTMLstr += "\n"; HTMLstr += "\n"; HTMLstr += "\n"; if (ie||ns6) HTMLstr+= "</div>\n"; // if (n) HTMLstr+= "</layer>\n"; HTMLstr += "\n"; } function addItem(idItem, text, hint, location, altLocation) { var Lookup = ""; if (HTMLstr.indexOf(Lookup) != -1) { alert(idParent + " already exist"); return; } var MENUitem = ""; MENUitem += "\n\n"; 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||ns6) { MENUitem += "<td>\n"; MENUitem += "<div id='"+idItem+"' style='position:relative; font: "+this.menuFont+";'>\n"; 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 += "| \n"; MENUitem += text; MENUitem += "</a>\n"; MENUitem += "</div>\n"; MENUitem += "</td>\n"; } MENUitem += "\n\n"; MENUitem += "\n"; HTMLstr = HTMLstr.replace("\n", MENUitem); } function addSubItem(idParent, text, hint, location) { var MENUitem = ""; Lookup = ""; if (HTMLstr.indexOf(Lookup) == -1) { alert(idParent + " not found"); return; } Lookup = ""; if (HTMLstr.indexOf(Lookup) == -1) { if (n) { MENUitem += "\n"; MENUitem += "<layer id='"+idParent+"submenu' visibility=hide bgcolor='"+this.bgColor+"'>\n"; MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">\n"; MENUitem += "\n"; MENUitem += "</table>\n"; MENUitem += "</layer>\n"; MENUitem += "\n"; } if (ie||ns6) { MENUitem += "\n"; MENUitem += "<div id='"+idParent+"submenu' onmouseout=operahide() style='position:absolute; visibility: hidden; z-index:100; width: "+this.subMenuPaneWidth+"; font: "+this.menuFont+"; top: -300;'>\n"; MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">\n"; MENUitem += "\n"; MENUitem += "</table>\n"; MENUitem += "</div>\n"; MENUitem += "\n"; } MENUitem += "\n"; HTMLstr = HTMLstr.replace("\n", MENUitem); } Lookup = "\n"; if (n) MENUitem = "<tr><td><a class=clsMenuItemNS title='"+hint+"' href='"+location+"'>"+text+"</a><br></td></tr>\n"; if (ie||ns6) MENUitem = "<tr><td><a class=clsMenuItemIE title='"+hint+"' href='"+location+"'>"+text+"</a><br></td></tr>\n"; MENUitem += Lookup; HTMLstr = HTMLstr.replace(Lookup, MENUitem); } function showMenu() { document.writeln(HTMLstr); } //////////////////////////////////////////////////////////////////////////// // Private declaration 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||ns6) { //alert(document.getElementById(idMainMenu+"submenu").id) menu = ie? eval(idMainMenu) : document.getElementById(idMainMenu); submenu = ie? eval(idMainMenu+"submenu.style") : document.getElementById(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 = ie? document.all[idMainMenu+"submenu"].style.posLeft : parseInt(document.getElementById(idMainMenu+"submenu").style.left); rightX = ie? leftX + document.all[idMainMenu+"submenu"].offsetWidth : leftX+parseInt(document.getElementById(idMainMenu+"submenu").offsetWidth); leftY = ie? document.all[idMainMenu+"submenu"].style.posTop+ document.all[idMainMenu+"submenu"].offsetHeight : parseInt(document.getElementById(idMainMenu+"submenu").style.top)+parseInt(document.getElementById(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&&!opr6) { var x = window.event.clientX; var y = window.event.clientY; if (x > rightX || x < leftX) hideAll(); else if (y > rightY) hideAll(); } if (n||ns6) { var x = e.pageX; var y = e.pageY; if (x > rightX || x < leftX) hideAll(); else if (y > rightY) hideAll(); } } function operahide(){ if (opr6){ if (!MainTable.contains(event.toElement)) hideAll() } } if (ie||ns6) { document.body.onclick=hideAll; document.body.onscroll=hideAll; document.body.onmousemove=updateIt; } if (document.layers) { window.captureEvents(Event.MOUSEMOVE); window.captureEvents(Event.CLICK); window.onmousemove=updateIt; window.onclick=hideAll; } </script> <script language="JavaScript"> function showToolbar() { // AddItem(id, text, hint, location, alternativeLocation); // AddSubItem(idParent, text, hint, location); menu = new Menu(); menu.addItem("webmasterid", "Web Building Sites", "Web Building Sites", null, null); menu.addItem("newsid", "News Sites", "News Sites", null, null); menu.addItem("freedownloadid", "Free Downloads", "Free Downloads", null, null); menu.addItem("searchengineid", "Search Engines", "Search Engines", null, null); menu.addItem("miscid", "Miscellaneous", "Miscellaneous", null, null); menu.addSubItem("webmasterid", "Dynamic Drive", "Dynamic Drive", "http://www.dynamicdrive.com/"); menu.addSubItem("webmasterid", "JavaScript Kit", "JavaScript Kit", "http://www.javascriptkit.com/"); menu.addSubItem("webmasterid", "Web Review", "Web Review", "http://www.webreview.com/"); menu.addSubItem("webmasterid", "Freewarejava.com", "Freewarejava.com", "http://www.freewarejava.com/"); menu.addSubItem("webmasterid", "Web Monkey", "Web Monkey", "http://www.webmonkey.com/"); menu.addSubItem("webmasterid", "Host Reach", "Host Reach", "http://www.hostreach.com"); menu.addSubItem("newsid", "CNN", "CNN", "http://www.cnn.com"); menu.addSubItem("newsid", "ABC News", "ABC News", "http://www.abcnews.com"); menu.addSubItem("newsid", "MSNBC", "MSNBC", "http://www.msnbc.com"); menu.addSubItem("newsid", "CBS news", "CBS News", "http://www.cbsnews.com"); menu.addSubItem("newsid", "News.com", "News.com", "http://news.com"); menu.addSubItem("newsid", "Wired News", "Wired News", "http://www.wired.com"); menu.addSubItem("newsid", "TechWeb", "TechWeb", "http://www.techweb.com"); menu.addSubItem("freedownloadid", "Dynamic Drive", "Dynamic Drive", "http://www.dynamicdrive.com/"); menu.addSubItem("freedownloadid", "Download.com", "Download.com", "http://download.com/"); menu.addSubItem("freedownloadid", "Tucows", "Tucows", "http://tucows.com/"); menu.addSubItem("searchengineid", "Yahoo", "Yahoo", "http://www.yahoo.com/"); menu.addSubItem("searchengineid", "Google", "Google", "http://www.google.com/"); menu.addSubItem("searchengineid", "Excite", "Excite", "http://www.excite.com"); menu.addSubItem("searchengineid", "HotBot", "HotBot", "http://www.hotbot.com"); menu.addSubItem("miscid", "Cnet", "Cnet", "http://www.cnet.com/"); menu.addSubItem("miscid", "RealAudio", "RealAudio", "http://www.realaudio.com/"); menu.addSubItem("miscid", "MP3.com", "MP3.com", "http://www.mp3.com/"); menu.showMenu(); } </script> <script language="JavaScript"> showToolbar(); </script> <script language="JavaScript"> function UpdateIt(){ if (ie&&keepstatic&&!opr6) document.all["MainTable"].style.top = document.body.scrollTop; setTimeout("UpdateIt()", 200); } UpdateIt(); </script>

Kommentare zu statisches Menu 2

5 Kommentar(e) vorhanden / Anzeige der neuesten 5

am 04.08.2006 um 12:01 Uhr von Alfred
Da ich totaler Laie bin gibt es eine Beschreibung des Menus ?? Wollte eine Datei ( a5.htm...

am 11.05.2006 um 12:38 Uhr von Nica
Hallo, ich habe einfach mal eine Frage zu diesem Menü, Ich möchte es wohl gerne in meine...

am 19.02.2004 um 14:44 Uhr von Verion
sorry *gg* bin zum ersten mal hier konnte ja nich ahnen das html aktiv is :D < a href= "s...

am 19.02.2004 um 14:42 Uhr von Verion
Linkbeschreibung ...

am 22.01.2004 um 20:54 Uhr von Sebastian
ich habe diesesscriptin meine hpeingebaut,wollte sie jetzt verlinken, aber weis nicht wo i...

Alle Kommentare anzeigen - Kommentar hinzufügen

Link: /javascript/scripts/javascript_0360_main.shtml .::. Aufrufe heute: 1 .::. Aufrufe gesamt: 20903