Fejl i menu, åbner i nyt vindue istedet for iframe
Jeg har lavet en DHTML menu som gerne skulle henvise mine links til et iframe, det virker fint hvis jeg laver et normalt link og benytter target="indhold" som er navnet på mit iframe, men hvis jeg derimod benytter menuen til at linke en side til mit iframe, åbner den bare i et nyt vindue, jeg har prøvet at sætte en standart på helesiden til destination indhold istedet for _self, og benytter også en css style filt til styre mine farver samt tabeller med, men den har ikke noget med det hele af gøre, jeg regner med at der kunne være en fejl i min DHTML menu som skaber denne fejl men kan ikke lige pt. få øje på en !Hvad siger i, search and destroy !
<html>
<head>
<title>Online Design</title>
<link rel="stylesheet" href="stylesheet.css" type="text/css">
<script type="text/javascript">
function Browser() {
var ua, s, i;
this.isIE = false; // Internet Explorer
this.isNS = false; // Netscape
this.version = null;
ua = navigator.userAgent;
s = "MSIE";
if ((i = ua.indexOf(s)) >= 0) {
this.isIE = true;
this.version = parseFloat(ua.substr(i + s.length));
return;
}
s = "Netscape6/";
if ((i = ua.indexOf(s)) >= 0) {
this.isNS = true;
this.version = parseFloat(ua.substr(i + s.length));
return;
}
// Treat any other "Gecko" browser as NS 6.1.
s = "Gecko";
if ((i = ua.indexOf(s)) >= 0) {
this.isNS = true;
this.version = 6.1;
return;
}
}
var browser = new Browser();
var activeButton = null;
/* [MODIFIED] This code commented out, not needed for activate/deactivate
on mouseover.
// Capture mouse clicks on the page so any active button can be
// deactivated.
if (browser.isIE)
document.onmousedown = pageMousedown;
else
document.addEventListener("mousedown", pageMousedown, true);
function pageMousedown(event) {
var el;
// If there is no active button, exit.
if (activeButton == null)
return;
// Find the element that was clicked on.
if (browser.isIE)
el = window.event.srcElement;
else
el = (event.target.tagName ? event.target : event.target.parentNode);
// If the active button was clicked on, exit.
if (el == activeButton)
return;
// If the element is not part of a menu, reset and clear the active
// button.
if (getContainerWith(el, "DIV", "menu") == null) {
resetButton(activeButton);
activeButton = null;
}
}
[END MODIFIED] */
function buttonClick(event, menuId) {
var button;
// Get the target button element.
if (browser.isIE)
button = window.event.srcElement;
else
button = event.currentTarget;
// Blur focus from the link to remove that annoying outline.
button.blur();
// Associate the named menu to this button if not already done.
// Additionally, initialize menu display.
if (button.menu == null) {
button.menu = document.getElementById(menuId);
if (button.menu.isInitialized == null)
menuInit(button.menu);
}
// [MODIFIED] Added for activate/deactivate on mouseover.
// Set mouseout event handler for the button, if not already done.
if (button.onmouseout == null)
button.onmouseout = buttonOrMenuMouseout;
// Exit if this button is the currently active one.
if (button == activeButton)
return false;
// [END MODIFIED]
// Reset the currently active button, if any.
if (activeButton != null)
resetButton(activeButton);
// Activate this button, unless it was the currently active one.
if (button != activeButton) {
depressButton(button);
activeButton = button;
}
else
activeButton = null;
return false;
}
function buttonMouseover(event, menuId) {
var button;
// [MODIFIED] Added for activate/deactivate on mouseover.
// Activates this button's menu if no other is currently active.
if (activeButton == null) {
buttonClick(event, menuId);
return;
}
// [END MODIFIED]
// Find the target button element.
if (browser.isIE)
button = window.event.srcElement;
else
button = event.currentTarget;
// If any other button menu is active, make this one active instead.
if (activeButton != null && activeButton != button)
buttonClick(event, menuId);
}
function depressButton(button) {
var x, y;
// Update the button's style class to make it look like it's
// depressed.
button.className += " menuButtonActive";
// [MODIFIED] Added for activate/deactivate on mouseover.
// Set mouseout event handler for the button, if not already done.
if (button.onmouseout == null)
button.onmouseout = buttonOrMenuMouseout;
if (button.menu.onmouseout == null)
button.menu.onmouseout = buttonOrMenuMouseout;
// [END MODIFIED]
// Position the associated drop down menu under the button and
// show it.
x = getPageOffsetLeft(button);
y = getPageOffsetTop(button) + button.offsetHeight;
// For IE, adjust position.
if (browser.isIE) {
x += button.offsetParent.clientLeft;
y += button.offsetParent.clientTop;
}
button.menu.style.left = x + "px";
button.menu.style.top = y + "px";
button.menu.style.visibility = "visible";
}
function resetButton(button) {
// Restore the button's style class.
removeClassName(button, "menuButtonActive");
// Hide the button's menu, first closing any sub menus.
if (button.menu != null) {
closeSubMenu(button.menu);
button.menu.style.visibility = "hidden";
}
}
//----------------------------------------------------------------------------
// Code to handle the menus and sub menus.
//----------------------------------------------------------------------------
function menuMouseover(event) {
var menu;
// Find the target menu element.
if (browser.isIE)
menu = getContainerWith(window.event.srcElement, "DIV", "menu");
else
menu = event.currentTarget;
// Close any active sub menu.
if (menu.activeItem != null)
closeSubMenu(menu);
}
function menuItemMouseover(event, menuId) {
var item, menu, x, y;
// Find the target item element and its parent menu element.
if (browser.isIE)
item = getContainerWith(window.event.srcElement, "A", "menuItem");
else
item = event.currentTarget;
menu = getContainerWith(item, "DIV", "menu");
// Close any active sub menu and mark this one as active.
if (menu.activeItem != null)
closeSubMenu(menu);
menu.activeItem = item;
// Highlight the item element.
item.className += " menuItemHighlight";
// Initialize the sub menu, if not already done.
if (item.subMenu == null) {
item.subMenu = document.getElementById(menuId);
if (item.subMenu.isInitialized == null)
menuInit(item.subMenu);
}
// [MODIFIED] Added for activate/deactivate on mouseover.
// Set mouseout event handler for the sub menu, if not already done.
if (item.subMenu.onmouseout == null)
item.subMenu.onmouseout = buttonOrMenuMouseout;
// [END MODIFIED]
// Get position for submenu based on the menu item.
x = getPageOffsetLeft(item) + item.offsetWidth;
y = getPageOffsetTop(item);
// Adjust position to fit in view.
var maxX, maxY;
if (browser.isNS) {
maxX = window.scrollX + window.innerWidth;
maxY = window.scrollY + window.innerHeight;
}
if (browser.isIE) {
maxX = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) +
(document.documentElement.clientWidth != 0 ? document.documentElement.clientWidth : document.body.clientWidth);
maxY = Math.max(document.documentElement.scrollTop, document.body.scrollTop) +
(document.documentElement.clientHeight != 0 ? document.documentElement.clientHeight : document.body.clientHeight);
}
maxX -= item.subMenu.offsetWidth;
maxY -= item.subMenu.offsetHeight;
if (x > maxX)
x = Math.max(0, x - item.offsetWidth - item.subMenu.offsetWidth
+ (menu.offsetWidth - item.offsetWidth));
y = Math.max(0, Math.min(y, maxY));
// Position and show the sub menu.
item.subMenu.style.left = x + "px";
item.subMenu.style.top = y + "px";
item.subMenu.style.visibility = "visible";
// Stop the event from bubbling.
if (browser.isIE)
window.event.cancelBubble = true;
else
event.stopPropagation();
}
function closeSubMenu(menu) {
if (menu == null || menu.activeItem == null)
return;
// Recursively close any sub menus.
if (menu.activeItem.subMenu != null) {
closeSubMenu(menu.activeItem.subMenu);
menu.activeItem.subMenu.style.visibility = "hidden";
menu.activeItem.subMenu = null;
}
removeClassName(menu.activeItem, "menuItemHighlight");
menu.activeItem = null;
}
// [MODIFIED] Added for activate/deactivate on mouseover. Handler for mouseout
// event on buttons and menus.
function buttonOrMenuMouseout(event) {
var el;
// If there is no active button, exit.
if (activeButton == null)
return;
// Find the element the mouse is moving to.
if (browser.isIE)
el = window.event.toElement;
else if (event.relatedTarget != null)
el = (event.relatedTarget.tagName ? event.relatedTarget : event.relatedTarget.parentNode);
// If the element is not part of a menu, reset the active button.
if (getContainerWith(el, "DIV", "menu") == null) {
resetButton(activeButton);
activeButton = null;
}
}
// [END MODIFIED]
//----------------------------------------------------------------------------
// Code to initialize menus.
//----------------------------------------------------------------------------
function menuInit(menu) {
var itemList, spanList;
var textEl, arrowEl;
var itemWidth;
var w, dw;
var i, j;
// For IE, replace arrow characters.
if (browser.isIE) {
menu.style.lineHeight = "2.5ex";
spanList = menu.getElementsByTagName("SPAN");
for (i = 0; i < spanList.length; i++)
if (hasClassName(spanList[i], "menuItemArrow")) {
spanList[i].style.fontFamily = "Webdings";
spanList[i].firstChild.nodeValue = "4";
}
}
// Find the width of a menu item.
itemList = menu.getElementsByTagName("A");
if (itemList.length > 0)
itemWidth = itemList[0].offsetWidth;
else
return;
// For items with arrows, add padding to item text to make the
// arrows flush right.
for (i = 0; i < itemList.length; i++) {
spanList = itemList[i].getElementsByTagName("SPAN");
textEl = null;
arrowEl = null;
for (j = 0; j < spanList.length; j++) {
if (hasClassName(spanList[j], "menuItemText"))
textEl = spanList[j];
if (hasClassName(spanList[j], "menuItemArrow"))
arrowEl = spanList[j];
}
if (textEl != null && arrowEl != null)
textEl.style.paddingRight = (itemWidth
- (textEl.offsetWidth + arrowEl.offsetWidth)) + "px";
}
// Fix IE hover problem by setting an explicit width on first item of
// the menu.
if (browser.isIE) {
w = itemList[0].offsetWidth;
itemList[0].style.width = w + "px";
dw = itemList[0].offsetWidth - w;
w -= dw;
itemList[0].style.width = w + "px";
}
// Mark menu as initialized.
menu.isInitialized = true;
}
//----------------------------------------------------------------------------
// General utility functions.
//----------------------------------------------------------------------------
function getContainerWith(node, tagName, className) {
// Starting with the given node, find the nearest containing element
// with the specified tag name and style class.
while (node != null) {
if (node.tagName != null && node.tagName == tagName &&
hasClassName(node, className))
return node;
node = node.parentNode;
}
return node;
}
function hasClassName(el, name) {
var i, list;
// Return true if the given element currently has the given class
// name.
list = el.className.split(" ");
for (i = 0; i < list.length; i++)
if (list[i] == name)
return true;
return false;
}
function removeClassName(el, name) {
var i, curList, newList;
if (el.className == null)
return;
// Remove the given class name from the element's className property.
newList = new Array();
curList = el.className.split(" ");
for (i = 0; i < curList.length; i++)
if (curList[i] != name)
newList.push(curList[i]);
el.className = newList.join(" ");
}
function getPageOffsetLeft(el) {
var x;
// Return the x coordinate of an element relative to the page.
x = el.offsetLeft;
if (el.offsetParent != null)
x += getPageOffsetLeft(el.offsetParent);
return x;
}
function getPageOffsetTop(el) {
var y;
// Return the x coordinate of an element relative to the page.
y = el.offsetTop;
if (el.offsetParent != null)
y += getPageOffsetTop(el.offsetParent);
return y;
}
</script>
<base target="indhold">
</head>
<body leftmargin="0" topmargin="20" marginwidth="0" marginheight="0" background="bg.gif">
<div align="center"><center>
<table width="780" border="0" cellspacing="0" cellpadding="0" style="border: 1 solid #000000">
<tr>
<td><img src="images/top_bar.gif" width="780" height="73"></td>
</tr>
<tr>
<td><img src="images/mdl_qut.gif" width="780" height="24"></td>
</tr>
</center>
<tr>
<td background="images/nv_bar.gif" height="28">
<p align="center">
<div align="right">
<div class="menuBar" style="width: 400; height: 15">
<a class="menuButton"
href="frames/indhold.html" target="inhold">Forside</a>
<a class="menuButton"
href=""
onclick="return buttonClick(event, 'designsMenu');"
onmouseover="buttonMouseover(event, 'designsMenu');">Designs</a>
<a class="menuButton" href=""
onclick="return buttonClick(event, 'serviceMenu');"
onmouseover="buttonMouseover(event, 'serviceMenu');">Service</a> <a class="menuButton"
href=""
onclick="return buttonClick(event, 'kontaktMenu');"
onmouseover="buttonMouseover(event, 'kontaktMenu');">Kontakt</a> <a class="menuButton"
href=""
onclick="return buttonClick(event, 'toolboxMenu');"
onmouseover="buttonMouseover(event, 'toolboxMenu');">Toolbox</a>
<div id="designsMenu" class="menu"
onmouseover="menuMouseover(event)">
<a class="menuItem" target="inhold" href="frames/indhold.html">Designs</a>
<a class="menuItem" href="frames/reference.html" target="inhold">Referencer</a>
</div>
<div id="kontaktMenu" class="menu"
onmouseover="menuMouseover(event)">
<a class="menuItem" href="#" target="inhold">Kontakt</a>
<a class="menuItem" href="#" target="inhold">Profil</a>
</div>
<div id="serviceMenu" class="menu"
onmouseover="menuMouseover(event)">
<a class="menuItem" href="#" target="inhold">Forum</a>
<a class="menuItem" href="#" target="inhold">Mail</a>
<a class="menuItem" href="#" target="inhold">Login</a>
</div>
<div id="toolboxMenu" class="menu"
onmouseover="menuMouseover(event)">
<a class="menuItem" href="#" target="inhold">Animationer</a>
<a class="menuItem" href="#" target="inhold">Scripts - ASP</a>
<a class="menuItem" href="#" target="inhold">Scripts - PHP</a>
<a class="menuItem" href="#" target="inhold">Scripts - HTML</a>
</div>
<!-- Divisioner sub menus. -->
<div id="divisionerElMenu" class="menu"
onmouseover="menuMouseover(event)">
<a class="menuItem" href="el_intro.html" target="inhold">Introduktion</a>
<a class="menuItem" href="el_kompetencer.html" target="inhold">Kompetencer</a>
</div>
<div id="divisionermarineMenu" class="menu"
onmouseover="menuMouseover(event)" style="left: 0px; top: 0px">
<a class="menuItem" href="marine_intro.html" target="inhold">Introduktion</a>
<a class="menuItem" href="marine_kompetencer.html" target="inhold">Kompetencer</a>
</div>
<div id="divisionercontractingMenu" class="menu"
onmouseover="menuMouseover(event)" style="left: 0px; top: 0px">
<a class="menuItem" href="contracting_intro.html" target="inhold">Introduktion</a>
<a class="menuItem" href="contracting_kompetencer.html" target="inhold">Kompetencer</a>
</div>
<div id="divisionerspeciallightMenu" class="menu"
onmouseover="menuMouseover(event)" style="left: 0px; top: 0px">
<a class="menuItem" href="speciallight_intro.html" target="inhold">Introduktion</a>
<a class="menuItem" href="speciallight_kompetencer.html" target="inhold">Kompetencer</a>
</div>
<div align="right">
</div>
</div>
</div>
</td>
</tr>
<center>
<tr>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0" background="images/bg_content.gif">
<tr>
<td width="75" valign="top">
<form name="form1" method="get" action="formmail.asp">
<table border="0" width="1%" cellpadding="2" height="1">
<tr>
<td width="50%" align="center" height="1" valign="middle">
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" align="left"><a href="http://www.onlinedesign.dk/frames/login/"><img border="0" src="key.gif" width="16" height="16"></a>
</td>
</tr>
<tr>
<td width="100%" align="left"><font face="Verdana"><font size="1"><b>Kontakt os</b></font> </font></td>
</tr>
</table>
<p>
<input name="realname" type="text" id="realname0" size="20" value="Navn" style="border: 1 solid #000000">
</p>
</td>
</tr>
<tr>
<td width="50%" align="center" height="25" valign="middle"><input name="email" type="text" id="email0" size="20" value="E-Mail" style="border: 1 solid #000000">
</td>
</tr>
<tr>
<td width="50%" align="center" height="25" valign="middle"><input name="telephone" type="text" id="telephone0" size="20" value="Telefon" style="border: 1 solid #000000">
</td>
</tr>
<tr>
<td width="50%" align="center" height="100" valign="middle"><textarea rows="4" name="besked" cols="15" style="border: 1 solid #000000">Besked</textarea></td>
</tr>
</center>
<tr>
<td width="50%" align="center" height="51" valign="middle">
<p align="left"><input type="submit" name="Submit" value="Send"></p>
</td>
</tr>
<center>
<input name="recipient" type="hidden" id="recipient" value="kristian@onlinedesign.dk">
<input name="subject" type="hidden" id="subject" value="Kontakt From">
<input name="redirect" type="hidden" id="redirect" value="redirect.htm">
<input name="required" type="hidden" id="required" value="telephone, realname">
</form>
</table>
</center>
</td>
<td valign="top" width="645">
<table width="479" border="0" cellspacing="0" cellpadding="0" align="left" height="273">
<tr>
<td width="8" height="273"> </td>
<td width="467" height="273"><font face="Arial, Helvetica, sans-serif" size="2">
<!-- IFRAME begin-->
<IFRAME SRC="frames\indhold.html" NAME="indhold" FRAMEBORDER="NO" SCROLLING="YES" WIDTH="467" HEIGHT="280"></IFRAME>
<!-- IFRAME end-->
</font></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td background="images/index.1.gif">
<table border="0" width="104%" cellspacing="5" cellpadding="15" height="69">
<tr>
<td width="18%" align="right" height="33">
<p align="left">
</td>
<td width="70%" align="right" height="33">
</td>
<td width="12%" height="33">
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<p>
<br>
</p>
<center>
<script language="javascript" type="text/javascript">
<!--
document.write('<a href="http://www.chart.dk/ref.asp?ct=v003&id=92853" target="_blank">');
var myref; myref=document.referrer; if(top.document.referrer!=null) myref=top.document.referrer;
document.write('<img src="http://cluster.chart.dk/chart.asp?id=92853&style=7&secID=' + Math.random()*10000000 + '&ref=' + escape(myref) + '" border="0" alt="Chart.dk"><');
document.write('/a>');
//-->
</script>
<noscript>
<a href="http://www.chart.dk/ref.asp?ct=v003&id=92853" target="_blank"><img src="http://cluster.chart.dk/chart.asp?id=92853&style=7&secID=1" border="0" alt="Chart.dk"></a>
</noscript>
<center>
</body>
</html>
