Snoop: Javascriptbefehl onmouseover per Javascript einfügen

Beitrag lesen

SELF-Forum

Javascriptbefehl onmouseover per Javascript einfügen

Snoop
– Informationen zu den Bewertungsregeln

Hallo Zusammen,

ich habe ein Problem.
Ich möchte mittels Javascript zu Bildern per Javascript ein onmouseover-Befehl einfügen.

In den Developertools des IE sieht das auch meines Erachtens okay aus, doch leider regeiert der IE nicht auf das neue onmouseover.

Hat jemand eine Lösung?

Hier das HTML inkl. Script:

<html>  
	<html>  
<head>  
<title>Titel</title>  
  
<script type="text/javascript">  
function erweitern() {  
document.getElementById('bild1').setAttribute("onmouseover", "anzeigen('bild1')\;");  
document.getElementById('bild1').setAttribute("onmouseout", "schliessen()\;");  
}  
  
function anzeigen(das){  
 var BildUrl = "";  
  BildUrl=document.getElementById(das).src;  
 var HTMLCode = "<img src=\"" + BildUrl + "\">";  
 document.getElementById('container').insertAdjacentHTML("AfterBegin" , HTMLCode);  
 }  
  
 function schliessen(){  
 delay("100");  
 Neu = "<div id=\"container\" class =\"container\"><\/div>";  
 document.getElementById('container').innerHTML = Neu;  
 }  
  
  
 // a javascript "sleep" function  
// gap specifies the sleep time in miliseconds  
function delay(gap){  
 var then,now;  
 then=new Date().getTime();  
 now=then;  
 while((now-then)<gap) {  
  now=new Date().getTime();  
 }  
}  
</script>  
  
<style type="text/css">  
  
.container {  
position: absolute;  
       top: 10%;  
       left: 30%;  
       margin-top: -5px;  
       margin-left: -75px;  
}  
  
</style>  
</head>  
<body>  
<table border="1"><tr><td>  
<a href="javascript:erweitern()" >Erweitern</a>  
<img src="1.jpg" id="bild1" border="1" height="130" width="100" onmouseover="" onmouseout="">  
</td><td>  
<img src="2.jpg"  id="bild2" border="1" height="130" width="100" onmouseover="anzeigen('bild2');"  onmouseout="schliessen();">  
</td></tr></table>  
<div id="container" class ="container"></div>  
  
</body>  
</html>

Nach dem Ausführen von "erweitern" sieht das HTML wie folgt aus:

  
<!-- saved from url=(0029)file://Y:\test\Test_Page.html -->  
<!-- Generated by Developer Tools. This might not be an accurate representation of the original source file -->  
<HTML><HEAD><TITLE>Titel</TITLE>  
<SCRIPT type=text/javascript>  
function erweitern() {  
document.getElementById('bild1').setAttribute("onmouseover", "anzeigen('bild1')\;");  
document.getElementById('bild1').setAttribute("onmouseout", "schliessen()\;");  
}  
  
function anzeigen(das){  
 var BildUrl = "";  
  BildUrl=document.getElementById(das).src;  
 var HTMLCode = "<img src=\"" + BildUrl + "\">";  
 document.getElementById('container').insertAdjacentHTML("AfterBegin" , HTMLCode);  
 }  
  
 function schliessen(){  
 delay("100");  
 Neu = "<div id=\"container\" class =\"container\"><\/div>";  
 document.getElementById('container').innerHTML = Neu;  
 }  
  
  
 // a javascript "sleep" function  
// gap specifies the sleep time in miliseconds  
function delay(gap){  
 var then,now;  
 then=new Date().getTime();  
 now=then;  
 while((now-then)<gap) {  
  now=new Date().getTime();  
 }  
}  
</SCRIPT>  
  
<STYLE type=text/css>.container {  
	POSITION: absolute; MARGIN-TOP: -5px; MARGIN-LEFT: -75px; TOP: 10%; LEFT: 30%  
}  
</STYLE>  
</HEAD>  
<BODY>  
<TABLE border=1>  
<TBODY>  
<TR>  
<TD><A href="javascript:erweitern()">Erweitern</A> <IMG id=bild1 onmouseover="anzeigen('bild1');" onmouseout=schliessen(); border=1 src="1.jpg" width=100 height=130> </TD>  
<TD><IMG id=bild2 onmouseover="anzeigen('bild2');" onmouseout=schliessen(); border=1 src="2.jpg" width=100 height=130> </TD></TR></TBODY></TABLE>  
<DIV id=container class=container>  
<DIV id=container class=container></DIV></DIV></BODY></HTML>
Beitrag melden
–
Informationen zu den Bewertungsregeln