nicht angemeldet
Hallo allerseits,
ich habe im Internet ein Dropdownmenu gefunden welches genau so ist wie ich es haben will. Naja, bis auf eine kleine Sache. Wenn ich auf einen Menupunkt klicke bleibt das Dropdown menu weiterhin offen. Da ich die Links nicht zum Seitenwechsel einstelle und sich durch das anklicken der Menupunkte ein selbstgemachtes Fenster öffnet sieht es halt blöd aus wenn das Menu weiterhin ausgeklappt bleibt. Nun meine Frage, wie ändere ich das?
Hier der Code:
<script type="text/javascript">//<![CDATA[ function Browser() { var ua, s, i; this.isIE = false; // Internet Explorer this.isOP = false; // Opera this.isNS = false; // Netscape this.version = null; ua = navigator.userAgent; s = "Opera"; if ((i = ua.indexOf(s)) >= 0) { this.isOP = 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; } s = "Gecko"; if ((i = ua.indexOf(s)) >= 0) { this.isNS = true; this.version = 6.1; return; } s = "MSIE"; if ((i = ua.indexOf(s))) { this.isIE = true; this.version = parseFloat(ua.substr(i + s.length)); return; } } var browser = new Browser(); var activeButton = null; if (browser.isIE) document.onmousedown = pageMousedown; else document.addEventListener("mousedown", pageMousedown, true); function pageMousedown(event) { var el; if (activeButton == null) return; if (browser.isIE) el = window.event.srcElement; else el = (event.target.tagName ? event.target : event.target.parentNode); if (el == activeButton) return; if (getContainerWith(el, "DIV", "menu") == null) { resetButton(activeButton); activeButton = null; } } function buttonClick(event, menuId) { var button; if (browser.isIE) button = window.event.srcElement; else button = event.currentTarget; button.blur(); if (button.menu == null) { button.menu = document.getElementById(menuId); if (button.menu.isInitialized == null) menuInit(button.menu); } if (activeButton != null) resetButton(activeButton); if (button != activeButton) { depressButton(button); activeButton = button; } else activeButton = null; return false; } function buttonMouseover(event, menuId) { var button; if (browser.isIE) button = window.event.srcElement; else button = event.currentTarget; if (activeButton != null && activeButton != button) buttonClick(event, menuId); } function depressButton(button) { var x, y; button.className += " menuButtonActive"; x = getPageOffsetLeft(button); y = getPageOffsetTop(button) + button.offsetHeight; 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"; if (button.menu.iframeEl != null) { button.menu.iframeEl.style.left = button.menu.style.left; button.menu.iframeEl.style.top = button.menu.style.top; button.menu.iframeEl.style.width = button.menu.offsetWidth + "px"; button.menu.iframeEl.style.height = button.menu.offsetHeight + "px"; button.menu.iframeEl.style.display = ""; } } function resetButton(button) { removeClassName(button, "menuButtonActive"); if (button.menu != null) { closeSubMenu(button.menu); button.menu.style.visibility = "hidden"; if (button.menu.iframeEl != null) button.menu.iframeEl.style.display = "none"; } } function menuMouseover(event) { var menu; if (browser.isIE) menu = getContainerWith(window.event.srcElement, "DIV", "menu"); else menu = event.currentTarget; if (menu.activeItem != null) closeSubMenu(menu); } function menuItemMouseover(event, menuId) { var item, menu, x, y; if (browser.isIE) item = getContainerWith(window.event.srcElement, "A", "menuItem"); else item = event.currentTarget; menu = getContainerWith(item, "DIV", "menu"); if (menu.activeItem != null) closeSubMenu(menu); menu.activeItem = item; item.className += " menuItemHighlight"; if (item.subMenu == null) { item.subMenu = document.getElementById(menuId); if (item.subMenu.isInitialized == null) menuInit(item.subMenu); } x = getPageOffsetLeft(item) + item.offsetWidth; y = getPageOffsetTop(item); var maxX, maxY; 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); } if (browser.isOP) { maxX = document.documentElement.scrollLeft + window.innerWidth; maxY = document.documentElement.scrollTop + window.innerHeight; } if (browser.isNS) { maxX = window.scrollX + window.innerWidth; maxY = window.scrollY + window.innerHeight; } 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)); item.subMenu.style.left = x + "px"; item.subMenu.style.top = y + "px"; item.subMenu.style.visibility = "visible"; if (item.subMenu.iframeEl != null) { item.subMenu.iframeEl.style.left = item.subMenu.style.left; item.subMenu.iframeEl.style.top = item.subMenu.style.top; item.subMenu.iframeEl.style.width = item.subMenu.offsetWidth + "px"; item.subMenu.iframeEl.style.height = item.subMenu.offsetHeight + "px"; item.subMenu.iframeEl.style.display = ""; } if (browser.isIE) window.event.cancelBubble = true; else event.stopPropagation(); } function closeSubMenu(menu) { if (menu == null || menu.activeItem == null) return; if (menu.activeItem.subMenu != null) { closeSubMenu(menu.activeItem.subMenu); menu.activeItem.subMenu.style.visibility = "hidden"; if (menu.activeItem.subMenu.iframeEl != null) menu.activeItem.subMenu.iframeEl.style.display = "none"; menu.activeItem.subMenu = null; } removeClassName(menu.activeItem, "menuItemHighlight"); menu.activeItem = null; } function menuInit(menu) { var itemList, spanList; var textEl, arrowEl; var itemWidth; var w, dw; var i, j; 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"; } } itemList = menu.getElementsByTagName("A"); if (itemList.length > 0) itemWidth = itemList[0].offsetWidth; else return; 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"; if (browser.isOP) arrowEl.style.marginRight = "0px"; } } 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"; } if (browser.isIE) { var iframeEl = document.createElement("IFRAME"); iframeEl.frameBorder = 0; iframeEl.src = "javascript:false;"; iframeEl.style.display = "none"; iframeEl.style.position = "absolute"; iframeEl.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)"; menu.iframeEl = menu.parentNode.insertBefore(iframeEl, menu); } menu.isInitialized = true; } function getContainerWith(node, tagName, className) { 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; 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; 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; x = el.offsetLeft; if (el.offsetParent != null) x += getPageOffsetLeft(el.offsetParent); return x; } function getPageOffsetTop(el) { var y; y = el.offsetTop; if (el.offsetParent != null) y += getPageOffsetTop(el.offsetParent); return y; } //]]></script> <!-- Menu bar. --> <div class="menuBar" style="width:80%;"> <a class="menuButton" href="" onclick="return buttonClick(event, 'fileMenu');" onmouseover="buttonMouseover(event, 'fileMenu');">File</a></div> <!-- Main menus. --> <div id="fileMenu" class="menu" onmouseover="menuMouseover(event)"><a class="menuItem" href="blank.html">File Menu Item 1</a><a class="menuItem" href="" onclick="return false;" onmouseover="menuItemMouseover(event, 'fileMenu2');"><span class="menuItemText">File Menu Item 2</span><span class="menuItemArrow">▶</span></a> <a class="menuItem" href="blank.html">File Menu Item 3</a> <a class="menuItem" href="blank.html">File Menu Item 4</a> <a class="menuItem" href="blank.html">File Menu Item 5</a> <div class="menuItemSep"></div> <a class="menuItem" href="blank.html">File Menu Item 6</a> </div> <!-- File sub menus. --> <div id="fileMenu2" class="menu"> <a class="menuItem" href="blank.html">File Menu 2 Item 1</a> <a class="menuItem" href="blank.html">File Menu 2 Item 2</a> </div>
Matthias Apsel