Søg
Avatar billede danielks Nybegynder
03. oktober 2002 - 20:13 Der er 9 kommentarer og
1 løsning

udvidende menu

jeg skal bruge et script der kan lave den samme menu form som på www.guleroden.dk (dem som info - funktioner mm...)

og det skal være forholdsvis enkelt mht kode....
Avatar billede t_kris Nybegynder
03. oktober 2002 - 20:29 #1
<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: red;}
</style>
</head>

<body marginwidth="0" marginheight="0" leftmargin="0" topmargin="0">

<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")
////////////////////////////////////////////////////////////////////////////
// Function Menu() //
////////////////////////////////////////////////////////////////////////////
rightX = 0;
function Menu()
{
this.bgColor = "#3399cc";
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 = 1;
this.subMenuPaneBorder = 1;

this.subMenuPaneWidth = 150;

lastMenu = null;

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

HTMLstr = "";
HTMLstr += "<!-- MENU PANE DECLARATION BEGINS -->\n";
HTMLstr += "\n";
if (ie) HTMLstr += "<div id='MainTable' style='position:relative'>\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>&nbsp;";
HTMLstr += "<!-- MAIN MENU STARTS -->\n";
HTMLstr += "<!-- MAIN_MENU -->\n";
HTMLstr += "<!-- MAIN MENU ENDS -->\n";
if (n) HTMLstr += "</td>";
HTMLstr += "</tr>\n";
HTMLstr += "</table>\n";
HTMLstr += "\n";
HTMLstr += "<!-- SUB MENU STARTS -->\n";
HTMLstr += "<!-- SUB_MENU -->\n";
HTMLstr += "<!-- SUB MENU ENDS -->\n";
HTMLstr += "\n";
if (ie) HTMLstr+= "</div>\n";
// if (n) HTMLstr+= "</layer>\n";
HTMLstr += "<!-- MENU PANE DECALARATION ENDS -->\n";
}

function addItem(idItem, text, hint, location, altLocation)
{
var Lookup = "<!-- ITEM "+idItem+" -->";
if (HTMLstr.indexOf(Lookup) != -1)
{
alert(idParent + " already exist");
return;
}
var MENUitem = "";
MENUitem += "\n<!-- ITEM "+idItem+" -->\n";
if (n)
{
MENUitem += "<ilayer name="+idItem+">";
MENUitem += "<a href='.' class=clsMenuItemNS onmouseover=\"displaySubMenu('"+idItem+"')\" onclick=\"return false;\">";
MENUitem += "|&nbsp;";
MENUitem += text;
MENUitem += "</a>";
MENUitem += "</ilayer>";
}
if (ie)
{
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 += "|&nbsp;\n";
MENUitem += text;
MENUitem += "</a>\n";
MENUitem += "</div>\n";
MENUitem += "</td>\n";
}
MENUitem += "<!-- END OF ITEM "+idItem+" -->\n\n";
MENUitem += "<!-- MAIN_MENU -->\n";

HTMLstr = HTMLstr.replace("<!-- MAIN_MENU -->\n", MENUitem);
}

function addSubItem(idParent, text, hint, loca, 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 += "\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 += "<!-- NEXT ITEM OF SUB MENU "+ idParent +" -->\n";
MENUitem += "</table>\n";
MENUitem += "</layer>\n";
MENUitem += "\n";
}
if (ie)
{
MENUitem += "\n";
MENUitem += "<div id='"+idParent+"submenu' style='position:absolute; visibility: hidden; width: "+this.subMenuPaneWidth+"; font: "+this.menuFont+"; top: -300;'>\n";
MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">\n";
MENUitem += "<!-- NEXT ITEM OF SUB MENU "+ idParent +" -->\n";
MENUitem += "</table>\n";
MENUitem += "</div>\n";
MENUitem += "\n";
}
MENUitem += "<!-- SUB_MENU -->\n";
HTMLstr = HTMLstr.replace("<!-- SUB_MENU -->\n", MENUitem);
}

Lookup = "<!-- NEXT ITEM OF SUB MENU "+ idParent +" -->\n";
if (n) MENUitem = "<tr><td ><IMG SRC="+loca+" WIDTH=12 HEIGHT=12 BORDER=0> ";
if (ie) MENUitem = "<tr><td><IMG SRC="+loca+" WIDTH=12 HEIGHT=12 BORDER=0> ";
MENUitem += Lookup;
HTMLstr = HTMLstr.replace(Lookup, MENUitem);


Lookup = "<!-- NEXT ITEM OF SUB MENU "+ idParent +" -->\n";
if (n) MENUitem = "<a class=clsMenuItemNS title='"+hint+"' href='"+location+"'>"+text+"</a><br>\n";
if (ie) MENUitem = "<a class=clsMenuItemIE title='"+hint+"' href='"+location+"'>"+text+"</a><br>\n";
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, loca, location);

menu = new Menu();
menu.addItem("menu1id", "Menu 1", "Menu 1", null, null);
menu.addItem("menu2id", "Menu 2", "Menu 2", null, null);
menu.addItem("menu3id", "Menu 3", "Menu 3", null, null);
menu.addItem("menu4id", "Menu 4", "Menu 4", null, null);
menu.addItem("menu5id", "Menu 5", "Menu 5", null, null);

menu.addSubItem("menu1id", "Menu 1 Punkt 1", "Menu 1 Punkt 1", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu1id", "Menu 1 Punkt 2", "Menu 1 Punkt 2", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu1id", "Menu 1 Punkt 3", "Menu 1 Punkt 3", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");

menu.addSubItem("menu2id", "Menu 1 Punkt 1", "Menu 2 Punkt 1", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu2id", "Menu 1 Punkt 2", "Menu 2 Punkt 2", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu2id", "Menu 1 Punkt 3", "Menu 2 Punkt 3", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");

menu.addSubItem("menu3id", "Menu 1 Punkt 1", "Menu 3 Punkt 1", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu3id", "Menu 1 Punkt 2", "Menu 3 Punkt 2", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu3id", "Menu 1 Punkt 3", "Menu 3 Punkt 3", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");

menu.addSubItem("menu4id", "Menu 4 Punkt 1", "Menu 4 Punkt 1", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu4id", "Menu 4 Punkt 2", "Menu 4 Punkt 2", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu4id", "Menu 4 Punkt 3", "Menu 4 Punkt 3", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");

menu.addSubItem("menu5id", "Menu 5 Punkt 1", "Menu 5 Punkt 1", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu5id", "Menu 5 Punkt 2", "Menu 5 Punkt 2", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");
menu.addSubItem("menu5id", "Menu 5 Punkt 3", "Menu 5 Punkt 3", "http://www.ahv.f2s.com/image/it.jpg", "http://www.ahv.f2s.com/");

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>

</body>
</html>

Her er en den er hentet fra spørgsmål http://www.eksperten.dk/spm/171791
Avatar billede bongobride Nybegynder
03. oktober 2002 - 20:30 #2
ellers er der masser af dem her, som du så kan udvælge hvilken du syns der er bedst : www.viewsource.dk
Avatar billede t_kris Nybegynder
03. oktober 2002 - 20:31 #3
Den linder den ikke men det er en menu
Avatar billede danielks Nybegynder
03. oktober 2002 - 21:03 #4
Citat mig selv : og det skal være forholdsvis enkelt mht kode....
Avatar billede danielks Nybegynder
03. oktober 2002 - 21:04 #5
desuden er link billedet det samme til alle mine links, så det skal være en kode der indeholder kordinater på 1 billede, og ikke billedet navn...
Avatar billede t_kris Nybegynder
03. oktober 2002 - 22:03 #6
forholdsvis enkelt kode ????
er denne nemmere http://dynamicdrive.com/dynamicindex1/sm/index.htm
Avatar billede danielks Nybegynder
03. oktober 2002 - 22:57 #7
ja og så skal dropdown'en lige være et billede istedet...
Avatar billede t_kris Nybegynder
04. oktober 2002 - 15:36 #8
Det er den sammen menu uden bilder
Avatar billede danielks Nybegynder
08. oktober 2002 - 14:22 #9
jeg lukker uden at dele point ud hvis der ikke kommer nogle ordentlige forslag...
Avatar billede danielks Nybegynder
28. november 2002 - 20:52 #10
Nå ingen svar... LUKKER
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
Programmeringssprog kurser
Kurser inden for grundlæggende programmering
Se alle Programmeringssprog kurser

Flere spørgsmål fra Andet programmering kategorien

Titel Indlæg Oprettet Seneste aktivitet
Bat file. Af johnnylassen i Andet programmering 4 23/04/202616:10 21/08/202611:03
Hjælp til Api.asmx Af lurup i Andet programmering 1 17/03/202609:27 17/03/202614:12
burgermenu til hjemmeside - hjælp! Af SabrinaL i Andet programmering 2 12/11/202514:10 21/08/202611:08
Hjælp til programmering af website Af hamdenlange i Andet programmering 16 17/08/202522:26 19/08/202515:53
Kan man registrere hvis folk lukker en side ned Af KurtG i Andet programmering 8 24/07/202513:06 28/07/202517:03
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 21:03 Kan man få Word viewer gratis Af Strawberry i Word
26/0813:28 Findes der en brugsanvisning til : "ONKYO Stereo Casette - Tape Deck - R1" Af Ikke-ekspert i Musik & videoafspillere
24/0820:07 Libra Office 26.2.5.2 - Er sort - Kan an ændre til lysere baggrund ? (Windows 11) Af Ikke-ekspert i Office & Kontorpakker
24/0811:24 Hvor kan jeg finde hjælp til at flytte fra min gamle Samsung Flip4 til min nye Samsung Galaxy S24 Af vbr i Apps til Android
24/0811:16 problem med mailbesked Af Pestilensen i Excel
White papers
Flere white papers »