nicht angemeldet
Hallo Leute,
ich habe ein unschönes Browserverhalten das ich nicht in den Griff bekomme. Vielleicht weiß jemand Rat?
Ich möchte über Bild einen Rahmen einblenden wenn die Maus über diesem
IMG ist. Ich mache das derzeit mit javascript.
Wenn man folgende Datei einmal in beiden Browsern aufruft (FF & IE)
http://www.zebrafrosch.com/test/TEST.html dann seht ihr das im linken Bild im Firefox mein Layout wie wild flackert wenn man die Maus bewegt.
Rechts ist alles prima.
Im rechten Bild ist im FF alles prima aber der IE ist zu träge manchmal kommt er mit dem mousout gar nicht mehr nach und führt die Funktion gar nicht aus.
Der Unterschied zwischen beiden Bilder ist der Funktionsaufruf im onmouseout. Links ist onmouseout am Bild, Rechts am DIV Layer.
Wie kann ich beide Nachteile wegbekommen so das es in beiden Browsern
geschmeidig läuft?
Hier mein Code Schnippsel:
<style type="text/css">
.out { position:relative; width:0px; height:0px;}
.in { position:absolute; top:10px; left:10px; width:286px; height:240px; border:10px solid #FFCC00; visibility:hidden; }
</style>
<script type="text/javascript">
function show(layer)
{
if (document.getElementById) document.getElementById(layer).style.visibility = "visible";
}
function hidden(layer)
{
if (document.getElementById) document.getElementById(layer).style.visibility = "hidden";
}
</script>
</head>
<body>
<table cellspacing="0" cellpadding="0" border="0" width="614">
<tr>
<td>
<div class="out"><div id="01" class="in"></div></div>
<img onmouseover="show('01')" onmouseout="hidden('01')" src="000174dec115a001.jpg" width="306" height="260" style="margin:10px;" /></td>
<td>
<div class="out"><div onmouseout="hidden('02')" id="02" class="in"></div></div>
<img onmouseover="show('02')" src="002064dec115a001.jpg" width="305" height="260" style="margin:10px;"/></td>
</tr>
</table>