Menu??
Hej,Jeg er igang med en lille menu, og jeg har et lille problem: den vil ikke lukke igen!
Kan I se hvorfor?
<html>
<head>
<style type="text/css">
a {text-decoration:none; font-family:verdana; font-size:14px; color:black;}
a:hover {text-decoration:none; font-family:verdana; font-size:14px; color:black;}
a:active {text-decoration:none; font-family:verdana; font-size:14px; color:black;}
a:visited {text-decoration:none; font-family:verdana; font-size:14px; color:black;}
a:link {text-decoration:none; font-family:verdana; font-size:14px; color:black;}
font {font-family:verdana; font-size:14px; color:black;}
</style>
<script language="javascript">
var isDom = (document.getElementById) ? true : false;
var isIE4 = (document.all & !isDom) ? true : false;
var isNS4 = (document.layers) ? true : false;
// Positions
function getposX(name){
var x = null;
if (isDom || isIE4){
obj = document.getElementById(name);
while(obj.offsetParent)
{
x += obj.offsetLeft;
obj = obj.offsetParent;
}
}
else if (isNS4)
{
x = document.getElementById(name).x;
}
x += 114;
return x;
}
function getposY(name){
var y = null;
if (isDom || isIE4){
obj = document.getElementById(name);
while(obj.offsetParent)
{
y += obj.offsetTop;
obj = obj.offsetParent;
}
}
else if (isNS4){
y = document.getElementById(name).y;
}
y += 4;
return y;
}
// Menu construction
function hide(){
if (document.getElementById('menu') != null)
document.getElementById('menu').style.visibility = 'hidden';
}
function Item(text, href, underlineBorder) {
this.text = text;
this.href = href;
this.underlineBorder = underlineBorder;
}
function Menu(width, heightOnCell, popInd, border, bgColor, padding) {
this.width = width;
this.heightOnCell = heightOnCell;
this.popInd = popInd;
this.border = border
this.bgColor = bgColor;
this.padding = padding;
}
function writeMenu(menuNum){
var str = "<div id='menu' style='position:absolute; left:" + getposX(menu[menuNum][0].popInd) +"; top:" + getposY(menu[menuNum][0].popInd) +"; width:" + menu[menuNum][0].width + "; heigth:" + (menu[menuNum][0].heightOnCell * (menu[menuNum].length - 1)) +";'>";
str += "<table cellpadding='" + menu[menuNum][0].padding +"' cellspacing='0' style='width:" + menu[menuNum][0].width + "; height: " + (menu[menuNum][0].heightOnCell * (menu[menuNum].length - 1)) +"; border: " + menu[menuNum][0].border + ";' bgcolor='" + menu[menuNum][0].bgColor +"' onMouseOut='hide()'>";
for (i = 1; i < menu[menuNum].length; i++){
if (menu[menuNum][i].underlineBorder) {var ulB = "border-bottom: " + menu[menuNum][0].border;}
else {ulB = null}
str += "<tr><td style='height: " + menu[menuNum][0].heightOnCell + "; " + (ulB ? ulB : '') +"'><a href='" + menu[menuNum][i].href +"'>" + menu[menuNum][i].text + "</a></td></tr>";
}
str += "</table></div>";
if (isDom){
var createDiv = document.createElement('div');
document.getElementsByTagName('body')[0].appendChild(createDiv);
createDiv.innerHTML = str;
ref = createDiv.style;
ref.visibility = 'visible';
}
}
// menuerne
var menu = new Array;
menu[0] = new Array();
menu[0][0] = new Menu('80','30','punkt1','1px solid black','white',0);
menu[0][1] = new Item('Hej','http://www.amberbenson.net',1);
menu[0][2] = new Item('HEJ2','http://www.amberbenson.net',1);
menu[0][3] = new Item('HEJ2','http://www.amberbenson.net',1);
menu[0][4] = new Item('HEJ2','http://www.amberbenson.net',0);
menu[1] = new Array();
menu[1][0] = new Menu('80','30','punkt2','1px solid black','white',0);
menu[1][1] = new Item('Hej','http://www.amberbenson.net',1);
menu[1][2] = new Item('HEJ2','http://www.amberbenson.net',1);
menu[1][3] = new Item('HEJ2','http://www.amberbenson.net',1);
menu[1][4] = new Item('HEJ2','http://www.amberbenson.net',0);
</script>
</head>
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<table cellpadding="0" cellspacing="0" style="width:120; height:200; border:1px solid black;">
<tr><td valign="middle" style="text-align:center; width:118; height:48; border-bottom:1px solid black;" id="punkt1" onmouseover="writeMenu(0)" onmouseout="hide();">
<a href="java script:void(0)">Punkt 1</a>
</td></tr>
<tr><td valign="middle" style="text-align:center; width:118; height:48; border-bottom:1px solid black;" id="punkt2" onmouseover="writeMenu(1)" onmouseout="hide();">
<a href="java script:void(0)">Punkt 2</a>
</td></tr>
<tr><td valign="middle" style="text-align:center; width:118; height:48; border-bottom:1px solid black;">
<a href="java script:void(0)">Punkt 3</a>
</td></tr>
<tr><td valign="middle" style="text-align:center; width:118; height:48;">
<a href="java script:void(0)">Punkt 4</a>
</td></tr>
</table>
<br>
<font>Eksempel på en dynamisk menu</font>
<br>
</body>
</html>
?????
