Servus!
Hab ein Problem mit meinem Code.
JEDER gvd Browser zeigt das so an wie ich es möchte, außer FireFox.
Da hauen die Links nicht hin...
Ich poste mal den Code fürs html...
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Language" content="de-at"/>
<meta name="author" content="3AHWII 2011/12"/>
<meta name="description" content="Hauptseite - Die Klassenhomepage der 3AHWII, einer Klasse der HTL Wolfsberg."/>
<meta name="keywords" content="HTL, Wolfsberg, Betriebsinformatik, Klassenhomepage, Klasse, Homepage, 3AHWII"/>
<meta name="robots" content="index"/>
<title>Home | 3AHWII | Klassenhomepage der HTL Wolfsberg</title>
<link href="noread/mainstyle.css" rel="stylesheet" type="text/css" media="screen" />
<script src="noread/actions.js" type="text/javascript"></script>
</head>
<body style="background:white url('noread/wallpaper.jpg') repeat-x scroll center top">
<!-- Ab hier kopieren und überschreiben -->
<div id="headbg">
<table id="header">
<tr>
<td id="headlab" colspan="2">
<a href="http://www.htl-wolfsberg.at/" target="_blank" title="Zur Homepage der HTL Wolfsberg gehen">
<p id="headlogo"></p></a></td>
<td id="headimg" colspan="3"></td>
</tr>
<tr id="head">
<td class="headtable"><a onclick="newsletter()"> Neuigkeiten<br/>Anstehende Tests </a></td>
<td class="headtable"><a onmouseover="mopen('hi2')" onmouseout="mclosetime()"> Schüler<br/>Klasse </a></td>
<td class="headtable"><a onmouseover="mopen('hi3')" onmouseout="mclosetime()"> Gegenstände<br/>Lernhilfe </a></td>
<td class="headtable"><a onmouseover="mopen('hi4')" onmouseout="mclosetime()"> Projekte<br/>Freizeit </a></td>
<td class="headtable"><a>Impressum<br/>Kontakt</a></td>
</tr>
</table>
</div>
<div id="box"><table><tr><td class="list"/><td class="list" id="hi2">
<ul onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<li><a href="schueler.html" title="Liste der Schüler unserer Klasse">Schülerverzeichnis</a></li>
<li><a href="profs.html" title="Diese Liste beinhaltet die Namen unserer Professoren, die Gegenstände und die Sprechstunden.">Professorenliste</a></li>
<li><a>Stundenplan</a></li>
</ul>
</td></tr></table></div>
<div id="box"><table><tr><td class="list"/><td class="list"/><td class="list" id="hi3">
<ul onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<li><a>Betriebsinformatik</a></li>
<li><a>Deutsch</a></li>
<li><a>Mathematik</a></li>
<li><a>Englisch</a></li>
</ul>
</td></tr></table></div>
<div id="box"><table><tr><td class="list"/><td class="list"/><td class="list"/><td class="list" id="hi4">
<ul onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<li><a href="proj-homepage.html" title="Bericht unseres Projektes „Klassenhomepage“">„Klassenhomepage“</a></li>
</ul>
</td></tr></table></div>
<!-- Bis hier kopieren und die anderen überschreiben -->
<div class="tablebody">
<h1>Willkommen!</h1>
</div>
<br/>
</body>
</html>Die Verlinkung in den Ordner "noread/..." hab ich nur damit dieser Ordner und Inhalt nicht von Suchmaschinen indiziert wird (festgelegt in einer robots.txt)
Jetzt das CSS...
Code
/* Allgemeines Stylesheet für die Klassenhomepage der 3AHWII */
#headlogo{
background:url('htl-passive.png') no-repeat center;
margin:0px; height:130px; width:300px;
}
#headlogo:hover{
background:url('htl-active.png') no-repeat center;
margin:0px; height:130px; width:300px
}
#header {
color:orange; background-color:transparent;
text-align:center; width:1024px; margin: 0px auto
}
#headbg{
background:black url('head.jpg') no-repeat center top;
width:100%; margin:0px
}
#headimg{
background:url('') no-repeat top right transparent scroll;
margin:0px; height:120px; width:70%
}
#headlab{
margin:0px; width:30%; border:none none transparent;
}
.headtable {
border-right: 1px solid transparent; border-left: 1px solid transparent;
border-top: 1px solid transparent;
width:20%; height:50px;
font-variant:small-caps;
font-weight:700;
color:orange;
text-decoration:none;
}
.tablebody{
width:1024px; margin:0px auto;
}
.tablecolumn{
height:auto; font-style:inherit;
}
.tablehide{
display:none
}
body {
margin:0px auto; color:black;
font-family:Arial, Helvetica, sans-serif;
font-size:medium; border:none;
}
h1 {font-size:50px; text-align:center; color:#444444} /* Nur für Seiten-Hauptüberschriften */
h2 {font-size:130%; text-align:left; color:#111111; margin:0px 0px 0px 10px}
h3 {font-size:90%; text-align:left; color:#333333; margin:0px 0px 0px 20px}
h4 {font-size:80%; text-align:left; color:#555555; margin:0px 0px 0px 30px}
h5 {font-size:70%; text-align:left; color:#777777; margin:0px 0px 0px 40px}
h6 {font-size:70%; text-align:left; color:#999999; margin:0px 0px 0px 50px}
p {font-size:100%; text-align:left; color:#404040; margin:0px 0px 0px 30px}
a:link {color:maroon; text-decoration:none; cursor:pointer}
a:visited {color:maroon; text-decoration:none; cursor:pointer}
a:hover {color:red; text-decoration:none}
a:focus {color:red; text-decoration:none}
a:active {color:red; text-decoration:none}
#head a:link {color:orange; text-decoration:none; cursor:pointer}
#head a:visited {color:orange; text-decoration:none; cursor:pointer}
#head a:focus {color:yellow; text-decoration:none; cursor:pointer}
#head a:hover {color:yellow; text-decoration:none; cursor:pointer}
#head a:active {color:yellow; text-decoration:none; cursor:pointer}
div#box{
width:1024px;
position:absolute;
left:50%;
margin-left:-512px;
top:188px;
}
.list {width:204px; visibility:hidden; background-color:#000000; border:orange solid thin; font-variant:small-caps}
.list ul {list-style-type:none}
.list a {color:orange}
.list a:link {color:orange}
.list a:visited {color:orange}
.list a:focus {color:yellow}
.list a:hover {color:yellow}
.list a:active {color:yellow}
Und noch das JavaScript...
Code
function newsletter()
{
var Passwort = "3AHWII";
var Eingabe = window.prompt(unescape("F%FCr diesen Bereich m%FCssen Sie sich authentifizieren."),unescape("ENTER dr%FCcken wenn Sie das Passwort nicht kennen"));
if(Eingabe==Passwort)
{ location.href="noread/news.html" };
}
var timeout = 750;
var closetimer = 0;
var ddmenuitem = 0;
function mopen(id)
{
mcancelclosetime();
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
ddmenuitem = document.getElementById(id);
ddmenuitem.style.visibility = 'visible';
}
function mclose()
{ if(ddmenuitem) ddmenuitem.style.visibility = 'hidden'; }
function mclosetime()
{ closetimer = window.setTimeout(mclose, timeout); }
function mcancelclosetime()
{
if(closetimer)
{
window.clearTimeout(closetimer);
closetimer = null;
}
}
document.onclick = mclose();Erklärung zum Soll-Aussehen:
Die UL in der DIV ( IDs = hi2, hi3, hi4 ) sollen mit Mouseover über den zugehörigen a-tag geöffnet werden.
Ich hab das in einer Extra-DIV wegen dem schwarzen Hintergrund des Hauptteils weil das sonst scheiße aussieht.
Aber in FireFox kann man die Unter-a-Tags der List in der DIV nicht wählen (also die Links werden zwar angezeigt aber nicht aktivierbar wodurch sich die Ausklappliste nach timeout() wieder schließt)
In Opera, IE6, IE9, Safari usw funktioniert das ohne Probleme....
Und das ärgert und nervt mich wirklich ziemlich...
Weiß jemand wo das Problem liegt? 
Da fällt mir ein: das mit document.onclick im javascript funkt überhaupt nicht...
