nicht angemeldet
menüleiste von IE imitieren
ich will die menüleiste vom internetexplorer imitieren, bin auch schon ziemlich weit gekommen (mit hilfe eines scripts von einer anderen seite). jetzt stehe ich aber vor einem problem, das für mich scheinbar unlösbar ist (ist eigentlich eh nicht so schwer): hover funktioniert nicht (dass sich ein rahmen bildet, wenn man drüber fährt). kann mit jemand helfen, den fehler zu finden?
mit dank im voraus
ernst
source:
externe css datei:
A:link {COLOR: #000000;
TEXT-DECORATION: none}
A:visited {COLOR: #000000;
TEXT-DECORATION: none}
A:active {COLOR: #000000;
TEXT-DECORATION: none}
A:hover {COLOR: #D6D3CE;
TEXT-DECORATION: underline}
TABLE { BORDER-RIGHT: white 1px solid;
BORDER-TOP: white 1px solid;
BORDER-LEFT: white 1px solid;
BORDER-BOTTOM: white 1px solid}
TABLE.main {BORDER-RIGHT: black 0px solid;
BORDER-TOP: black 0px solid;
BORDER-LEFT: black 0px solid;
BORDER-BOTTOM: black 0px solid}
TABLE.emboss { BORDER-RIGHT: white 1px solid;
BORDER-TOP: black 1px solid;
BORDER-LEFT: black 1px solid;
BORDER-BOTTOM: white 1px solid}
TD.main {BORDER-RIGHT: black 1px solid;
BORDER-TOP: black 1px solid;
BORDER-LEFT: black 1px solid;
BORDER-BOTTOM: black 1px solid}
TD.emboss {BORDER-RIGHT: black 1px solid;
BORDER-TOP: white 1px solid;
BORDER-LEFT: white 1px solid;
BORDER-BOTTOM: black 1px solid}
TD { BORDER-RIGHT: black 1px solid;
BORDER-TOP: black 1px solid;
FONT: 12px verdana, arial;
BORDER-LEFT: black 1px solid;
BORDER-BOTTOM: black 1px solid}
.form-button { FONT-SIZE: 12px;
COLOR: white;
FONT-FAMILY: Tahoma, Verdana, Arial, Helvetica, sans-serif;
BACKGROUND-COLOR: #C6C3BF}
IMG { BORDER-RIGHT: 0px;
BORDER-TOP: 0px;
BORDER-LEFT: 0px;
BORDER-BOTTOM: 0px}
TR.filelist {BACKGROUND-COLOR: #eeeeee}
TD.filelistfn { BORDER-RIGHT: #cccccc 1px solid;
BORDER-TOP: #cccccc 1px solid;
VERTICAL-ALIGN: middle;
BORDER-LEFT: #cccccc 1px solid;
BORDER-BOTTOM: #cccccc 1px solid}
TD.filelist { BORDER-RIGHT: #cccccc 1px solid;
BORDER-TOP: #cccccc 1px solid;
VERTICAL-ALIGN: middle;
BORDER-LEFT: #cccccc 1px solid;
BORDER-BOTTOM: #cccccc 1px solid}
p { font-family: tahoma, arial, verdana;
font-size: 11px;
color: #000000;
font-weight:; }
== ende css
source für html in der nächsten nachricht (zu viele zeichen)
-
<HTML><HEAD><TITLE>menu</TITLE>
<!-- MENU --> <STYLE type=text/css>BODY { MARGIN: 0px } #menuBar { BORDER-RIGHT: 0px solid; PADDING-RIGHT: 0px; BORDER-TOP: #f4f4f0 1px solid; PADDING-LEFT: 10px; Z-INDEX: 0; LEFT: 0px; PADDING-BOTTOM: 3px; MARGIN-left: 0px; BORDER-LEFT: 0px solid; WIDTH: 100%; COLOR: #D6D3CE; PADDING-TOP: 0px; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 0px; BACKGROUND-COLOR: #D6D3CE } #buttonBar { BORDER-RIGHT: 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #D6D3CE 1px solid; PADDING-LEFT: 0px; Z-INDEX: 100; LEFT: 0px; PADDING-BOTTOM: 3px; BORDER-LEFT: 1px solid; COLOR: #D6D3CE; PADDING-TOP: 0px; BORDER-BOTTOM: #c0c0c0 1px solid; POSITION: absolute; BACKGROUND-COLOR: #D6D3CE } A.menuButton { BORDER-RIGHT: #c0c0c0 1px solid; PADDING-RIGHT: 6px; BORDER-TOP: #808080 1px solid; PADDING-LEFT: 6px; FONT-SIZE: 8pt; PADDING-BOTTOM: 2px; BORDER-LEFT: #000000 1px solid; CURSOR: default; COLOR: #D6D3CE; PADDING-TOP: 0px; BORDER-BOTTOM: #000000 1px solid; FONT-STYLE: normal; FONT-FAMILY: Tahoma, MS Sans Serif, Arial, sans-serif; text-decoration: none; } A.menuButton:hover { BORDER-LEFT-COLOR: #ffffff; BORDER-BOTTOM-COLOR: #848284; COLOR: #000000; BORDER-TOP-STYLE: solid; BORDER-TOP-COLOR: #ffffff; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BACKGROUND-COLOR: #D6D3CE; text-decoration: none; BORDER-RIGHT-COLOR: #848284; BORDER-BOTTOM-STYLE: solid } .menu { BORDER-RIGHT: #808080 1px; PADDING-RIGHT: 1px; BORDER-TOP: #ffffff 1px; PADDING-LEFT: 1px; Z-INDEX: 101; VISIBILITY: hidden; PADDING-BOTTOM: 1px; MARGIN: 1px; BORDER-LEFT: #ffffff 1px; PADDING-TOP: 1px; BORDER-BOTTOM: #808080 1px; POSITION: absolute; BACKGROUND-COLOR: #8B8685 } A.menuItem { BORDER-RIGHT: #D6D3CE 1px solid; PADDING-RIGHT: 14px; BORDER-TOP: #D6D3CE 1px solid; DISPLAY: block; PADDING-LEFT: 12px; FONT-WEIGHT: normal; FONT-SIZE: 8pt; PADDING-BOTTOM: 2px; MARGIN: 0px; BORDER-LEFT: #D6D3CE 1px solid; CURSOR: default; COLOR: #D6D3CE; PADDING-TOP: 2px; BORDER-BOTTOM: #D6D3CE 1px solid; FONT-FAMILY: MS Sans Serif, Arial, Tahoma,sans-serif; BACKGROUND-COLOR: #D6D3CE; TEXT-DECORATION: none } A.menuItem:hover { BORDER-RIGHT: #D6D3CE 1px solid; BORDER-TOP: #D6D3CE 1px solid; BORDER-LEFT: #D6D3CE 1px solid; COLOR: #ffffff; BORDER-BOTTOM: #D6D3CE 1px solid; BACKGROUND-COLOR: #08246B; TEXT-DECORATION: none } </STYLE>
<SCRIPT type=text/javascript> // Determine browser type (IE 5.5).
var isIE5 = (navigator.userAgent.indexOf("MSIE 5") > 0) ? 1 : 0; var isIE55 = (navigator.userAgent.indexOf("MSIE 5.5") > 0) ? 1 : 0; var isIE6 = (navigator.userAgent.indexOf("MSIE 6") > 0) ? 1 : 0; var isNS6 = (navigator.userAgent.indexOf("Gecko") > 0) ? 1 : 0;
if (!isIE5 && !isIE55 && !isIE6) { window.location = "edit.jsp"; } // Global variable for tracking the currently active button. var activeButton = null;
// Capture mouse clicks on the page so any active button can be deactivated.
if (isIE5) document.onmousedown = pageMousedown; if (isNS6) document.addEventListener("mousedown", pageMousedown, true);
function pageMousedown(event) {
var className;
// If the object clicked on was not a menu button or item, close any active // menu.
if (isIE5) className = window.event.srcElement.className; if (isNS6) className = (event.target.className ? event.target.className : event.target.parentNode.className);
if (className != "menuButton" && className != "menuItem" && activeButton) { resetButton(activeButton); } }
function buttonClick(button, menuName) { // Blur focus from the link to remove that annoying outline.
button.blur();
// Associate the named menu to this button if not already done.
if (!button.menu) button.menu = document.getElementById(menuName);
// Reset the currently active button, if any.
if (activeButton&& activeButton != button) resetButton(activeButton);
// Toggle the button's state.
if (button.isDepressed) { resetButton(button); } else { depressButton(button); } return false; }
function buttonMouseover(button, menuName) {
// If any other button menu is active, deactivate it and activate this one. // Note: if this button has no menu, leave the active menu alone.
if (activeButton && activeButton != button) { resetButton(activeButton); if (menuName) buttonClick(button, menuName); } }
function depressButton(button) {
// Save current style values so they can be restored later. // Only needs to be done once. if (!button.oldBackgroundColor) { button.oldBackgroundColor = button.style.backgroundColor; button.oldBorderBottomColor = button.style.borderBottomColor; button.oldBorderRightColor = button.style.borderRightColor; button.oldBorderTopColor = button.style.borderTopColor; button.oldBorderLeftColor = button.style.borderLeftColor; button.oldColor = button.style.color; button.oldLeft = button.style.left; button.oldPosition = button.style.position; button.oldTop = button.style.top; }
// Change style value to make the button looks like it's // depressed.
button.style.backgroundColor = "#D6D3CE"; button.style.borderLeftColor = "#848284"; button.style.borderRightColor = "#FFFFFF"; button.style.borderTopColor = "#848284"; button.style.borderBottomColor = "#FFFFFF"; button.style.color = "#000000"; button.style.left = "1px"; button.style.position = "relative"; button.style.top = "1px";
// For IE, force first menu item to the width of the parent menu, // this causes mouseovers work for all items even when cursor is // not over the link text.
if (isIE5 && !button.menu.firstChild.style.width) button.menu.firstChild.style.width = button.menu.offsetWidth + "px";
// Position the associated drop down menu under the button and // show it. Note that the position must be adjusted according to // browser, styling and positioning.
x = getPageOffsetLeft(button); y = getPageOffsetTop(button) + button.offsetHeight; if (isIE5) y += 2; if (isNS6) { x--; y--; } button.menu.style.left = x + "px"; button.menu.style.top = y + "px"; button.menu.style.visibility = "visible";
// Set button state and let the world know which button is // active. button.isDepressed = true; activeButton = button; }
function resetButton(button) {
// Restore the button's style settings.
button.style.backgroundColor = button.oldBackgroundColor; button.style.borderBottomColor = button.oldBorderBottomColor; button.style.borderRightColor = button.oldBorderRightColor; button.style.borderTopColor = button.oldBorderTopColor; button.style.borderLeftColor = button.oldBorderLeftColor; button.style.color = button.oldColor; button.style.left = button.oldLeft; button.style.position = button.oldPosition; button.style.top = button.oldTop; // Hide the button's menu.
if (button.menu) button.menu.style.visibility = "hidden";
// Set button state and clear active menu global.
button.isDepressed = false; activeButton = null; }
function getPageOffsetLeft(el) {
// Return the true x coordinate of an element relative to the page.
return el.offsetLeft + (el.offsetParent ? getPageOffsetLeft(el.offsetParent) : 0); }
function getPageOffsetTop(el) {
// Return the true y coordinate of an element relative to the page.
return el.offsetTop + (el.offsetParent ? getPageOffsetTop(el.offsetParent) : 0); }
</SCRIPT> <!-- MENU -->
<META content="MSHTML 6.00.2600.0" name=GENERATOR></HEAD> <BODY bgColor=#D6D3CE leftMargin=0 topMargin=0 style="cursor:default"><!-- MENU CODE --><!-- Tags for the menu bar. --> <DIV id=menuBar> <A class=menuButton onmouseover="buttonMouseover(this, 'dateiMenu');" onclick="return buttonClick(this, 'dateiMenu');" href=" "> Datei   </A> <A class=menuButton onmouseover="buttonMouseover(this, 'bearbeitenMenu');" onclick="return buttonClick(this, 'bearbeitenMenu');" href=" "> Bearbeiten </A> <A class=menuButton onmouseover="buttonMouseover(this, 'ansichtMenu');" onclick="return buttonClick(this, 'ansichtMenu');" href=" "> Ansicht </A> <A class=menuButton onmouseover="buttonMouseover(this, 'favoritenMenu');" onclick="return buttonClick(this, 'favoritenMenu');" href=" "> Favoriten </A> <A class=menuButton onmouseover="buttonMouseover(this, 'extrasMenu');" onclick="return buttonClick(this, 'extrasMenu');" href=" "> Extras </A> <A class=menuButton onmouseover="buttonMouseover(this, 'hilfeMenu');" onclick="return buttonClick(this, 'hilfeMenu');" href=" "> ? </A> <!-- Tags for the drop down menus. -->
<DIV class=menu id=dateiMenu> <A class=menuItem href="about:blank" target="new">Neue Seite</A> <A class=menuItem disabled href="javascript:%20return%20null;">Öffnen</A> <A class=menuItem disabled href="javascript:%20return%20null;">Speichern</A> <A class=menuItem disabled href="javascript:%20return%20null;">Speichern unter...</A> <A class=menuItem disabled href="javascript:%20return%20null;">Drucken...</A> <A class=menuItem href="javascript:onClick=window.close();">Schließen</A> </DIV>
<DIV class=menu id=bearbeitenMenu> <A class=menuItem disabled href="javascript:%20return%20null;">Ausschneiden</A> <A class=menuItem disabled href="javascript:%20return%20null;">Kopieren</A> <A class=menuItem disabled href="javascript:%20return%20null;">Einfügen</A> <A class=menuItem disabled href="javascript:%20return%20null;">Alles markieren</A> <A class=menuItem disabled href="javascript:%20return%20null;">Suchen (aktuelle Seite)...</A> </DIV>
<DIV class=menu id=ansichtMenu> <A class=menuItem disabled href="javascript:%20return%20null;">Symbolleisten</A> <A class=menuItem disabled href="javascript:%20return%20null;">Statusleiste</A> <A class=menuItem disabled href="javascript:%20return%20null;">Explorerleiste</A> <A class=menuItem disabled href="javascript:%20return%20null;">Wechseln zu</A> <A class=menuItem disabled href="javascript:%20return%20null;">Abbrechen</A> <A class=menuItem disabled href="javascript:%20return%20null;">Aktualisieren</A> <A class=menuItem disabled href="javascript:%20return%20null;">Schriftgrad</A> <A class=menuItem disabled href="javascript:%20return%20null;">Codierung</A> <A class=menuItem disabled href="javascript:%20return%20null;">Quelltext anzeigen</A> <A class=menuItem disabled href="javascript:%20return%20null;">Vollbild</A> </DIV>
<DIV class=menu id=favoritenMenu> <A class=menuItem disabled href="javascript:%20return%20null;">Zu Favoriten hinzufügen</A> <A class=menuItem disabled href="javascript:%20return%20null;">Favoriten verwalten</A> <A class=menuItem disabled href="javascript:%20return%20null;">Links</A> </DIV>
<DIV class=menu id=extrasMenu><A class=menuItem disabled href="javascript:%20return%20null;">E-Mail und News</A> <A class=menuItem disabled href="javascript:%20return%20null;">Synchronisieren...</A> <A class=menuItem disabled href="javascript:%20return%20null;">Windows Update</A><A class=menuItem disabled href="javascript:%20return%20null;">Verwandte Links anzeigen</A><A class=menuItem disabled href="javascript:%20return%20null;">Webeinstellungen zurücksetzen...</A><A class=menuItem disabled href="javascript:%20return%20null;">Internetoptionen...</A> </DIV>
<DIV class=menu id=hilfeMenu><a class=menuItem disabled href="javascript:%20return%20null;">Inhalt und Index</a><a class=menuItem disabled href="javascript:%20return%20null;">Info</a></DIV> <!-- MENU CODE END -->
<SCRIPT> { window.status = "Fertig"; } </SCRIPT>
<LINK href="css.css" rel=stylesheet>
</IFRAME> </FORM> </FORM>
<script type="text/javascript"> <!-- if(navigator.userAgent.indexOf("en") > 0) { document.Testform.url.value = document.Testform.url.defaultValue; } //--> </script>
</BODY> </HTML>
-
<Flensburger-Pilsner-Werbung imitier!>
Moin! Moin! Moin! Moin! Moin!
source für html in der nächsten nachricht (zu viele zeichen)
Dann Link's! Link's! Link's! Link's! Link's!
Tschüß! Tschüß! Tschüß! Tschüß! Tschüß!
</Flensburger-Pilsner-Werbung imitier!>
Mal im Ernst: Glaubst du, irgendjemanden interessieren deine Codewüsten hier? Platzverschwendung ist sowas. Lad' die Sachen auf deinen Webspace hoch und mach einen Link drauf, dann klappts: Man kann sich die Sachen sofort im Browser ansehen, man kann den Validator damit füttern etc. Alles Dinge, die bei gepostetem Quelltext erstmal den Umstand erfordern (und dadurch Unwillen erzeugen), die Daten auf Festplatte zu speichern etc.
- Sven Rautenberg
-
danke für den tipp!
ernst
-