Hallo zusammen,
erneut bitte ich um Hilfe.
Das Problem ist folgendes. Die Links links erscheinen in einem grau, wenn man mit den Mauszeiger drüberfährt, werden sie blau. Naja, zumindest solltens sie das. Denn im Mozilla sind die Links trotz CSS-formatierung Unterstrichen und "link-blau".
Liegt es ev. daran, dass Mozilla die a: -Pseudo formatierungen nicht akzeptiert? Aber warum schluckt er auch die Farb-formatierung, die ja per p.titel festgelegt ist?
Mit Hilfe von Bio und fjh konnte ich zumindest schon mal vom MS-all-Objekt auf das DOM-getElementById-Objekt umsteigen, ich hoffe ihr könnt mir auch diesesmal helfen
<html>
<head>
<title>Reishauer IntraNet Seite - Titel</title>
<style type="text/css">
a:link {text-decoration:none;}
a:visited {text-decoration:none}
a:active {text-decoration:none;}
body { margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px; }
p.titel {font-family:Helvetica; font-size:10pt; color:#909090; font-weight:bold;}
p.menu {font-family:Helvetica; font-size:8pt; color:#bbbbbb; font-weight:bold; display:none;}
p.arrow {display:none}
#bereichemenu {position:absolute; left:130px; top:58px}
#sapmenu {position:absolute; left:203px; top:58px}
#pdmmenu {position:absolute; left:245px; top:58px}
#pcdesktopmenu {position:absolute; left:291px; top:58px}
#arrow {position:absolute; top:38px}
</style>
<script language="JavaScript">
function over(x)
{
out();
document.getElementById(x).style.color = "#4236A2"
}
function out()
{
/* Suboptimale Lösung, da Modifikationen durch die referenzielle Existenz der Variablen (eigentlich Konstanten) erschwert wird. */
document.getElementById("bereiche").style.color = "#909090"
document.getElementById("sap").style.color = "#909090"
document.getElementById("pdm").style.color = "#909090"
document.getElementById("pcdesktop").style.color = "#909090"
}
function show(x,y)
{
var menu = x +"menu";
hide();
document.getElementById(menu).style.display = "block"
document.getElementById("arrow").style.left = [y]
document.getElementById("arrow").style.display = "block"
}
function hide()
{
/* Dito oben; suboptimal. */
document.getElementById("bereichemenu").style.display = "none"
document.getElementById("sapmenu").style.display = "none"
document.getElementById("pdmmenu").style.display = "none"
document.getElementById("pcdesktopmenu").style.display = "none"
}
</script>
</head>
<body background="./images/title-background.jpg">
<p id="bereichemenu" class="menu">bereiche Menu</p>
<p id="sapmenu" class="menu">News Organisation Folgeprojekte RAG-Infos Dokumentation</p>
<p id="pdmmenu" class="menu">TS Menu</p>
<p id="pcdesktopmenu" class="menu">Sherpa Menu</p>
<p id="arrow" class="arrow" ><img src="./images/arrow.jpg"></p>
<!-- Note 4: Hier fängt der "eigentliche" HTML Teil an, also die Sachen, die ohne weiteres mit dem Front-Page oder einem anderen WYSIWYG-Editor geändert werden können -->
<table align=left border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
<tr>
<td width="121"><img border="0" src="./images/title-logo.jpg" width="121" height="83" ></td>
<td >
<table border="0" cellpadding="8" cellspacing="0" >
<tr>
<td><a href="javascript:show('bereiche','128px')"> <p class="titel" id="bereiche" onMouseover=over('bereiche') >Bereiche<p> </a></td>
<td><a href="javascript:show('sap','202px') "> <p class="titel" id="sap" onMouseover=over('sap') >SAP<p> </a></td>
<td><a href="javascript:show('pdm','243px') "> <p class="titel" id="pdm" onMouseover=over('pdm') >PDM<p> </a></td>
<td><a href="javascript:show('pcdesktop','289px') "> <p class="titel" id="pcdesktop" onMouseover=over('pcdesktop') >PC Desktop<p> </a></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>