nicht angemeldet
Warum funktioniert dieses Script nicht in HTML-Version 4.01 ?
0 
Struppi
1 0
Warum funktioniert dieses Script nicht in HTML-Version 4.01 ?
Hallo, ich habe ein Script erstellt, um ein kleines rotes Kästchen in einem großen schwarzen zu bewegen.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>roter_kasten</title><style type="text/css">
#schwarz {width:500px; height:350px; background-color:black; position:static; top:50px; left:50px;}
#rot {width:50px; height:50px; background-color:red; position:relative;}
</style><script language=JavaScript type="text/javascript">
var ver=0;
var hor=0;
function _links()
{
if(ver > 0)
{
ver--;
document.getElementById("rot").style.top = hor;
document.getElementById("rot").style.left = ver;
setTimeout('_links()', 25);
}
}
function _rechts()
{
if(ver < 450)
{
ver++;
document.getElementById("rot").style.top = hor;
document.getElementById("rot").style.left = ver;
setTimeout('_rechts()', 25);
}
}
function _hoch()
{
if(hor > 0)
{
hor--;
document.getElementById("rot").style.top = hor;
document.getElementById("rot").style.left = ver;
setTimeout('_hoch()', 25);
}
}
function _runter()
{
if(hor < 300)
{
hor++;
document.getElementById("rot").style.top = hor;
document.getElementById("rot").style.left = ver;
setTimeout('_runter()', 25);
}
}
</script>
</head>
<body>
<table width="80%">
<tbody>
<tr>
<td rowspan="4" width="60%"><div id="schwarz"><div id="rot" style="top:0px; left:0px;"></div></div></td>
<td height="25%" width="40%"><A onclick="_hoch();"><IMG src="bilder/oben.png" width="50" height="50" align="left" border="0"></A></td>
</tr>
<tr>
<td height="25%"><A onclick="_rechts();"><IMG src="bilder/rechts.png" width="50" height="50" align="left" border="0"></A></td>
</tr>
<tr>
<td height="25%"><A onclick="_runter();"><IMG src="bilder/unten.png" width="50" height="50" align="left" border="0"></A></td>
</tr>
<tr>
<td height="25%"><A onclick="_links();"><IMG src="bilder/links.png" width="50" height="50" align="left" border="0"></A></td>
</tr>
</tbody>
</table>
</body>
</html>
Das Problem ist, dass dieses Script erst funktioniert, wenn ich die Version im Doctype auf 4.0 umstelle oder weglasse. Die Frage ist nur: Wo ist der Fehler?
MfG Freddy
PS: Ich bin erst vor ein paar Wochen mit HTML und Javascript angefangen, also nicht über "große" Fehler wundern. ;)
-
Das Problem ist, dass dieses Script erst funktioniert, wenn ich die Version im Doctype auf 4.0 umstelle oder weglasse. Die Frage ist nur: Wo ist der Fehler?
Das Problem hat zwar mit dem DOCTYPE zu tun, aber nicht mit der HTML Version, sondern damit, dass du vom Quirksmode in den Standardmode schaltest. Falls du Firefox verwendest, schau mal in die Fehlerkonsole, vielleicht hilft dir das ja schon weiter.
Struppi.
-
Hi there,
Das Problem ist, dass dieses Script erst funktioniert, wenn ich die Version im Doctype auf 4.0 umstelle oder weglasse. Die Frage ist nur: Wo ist der Fehler?
wie Struppi schon geschrieben hat, setzt Du den Browser mit Deinem Doctype in einen anderen Modus, und zwar in einen, der Deine Koordinatenangaben so nicht mehr versteht.
document.getElementById("rot").style.top = hor;müsste in dem Fall
document.getElementById("rot").style.top = hor+'px';heissen, da der Browser in diesem Modus nicht einfach drauflos rätselt, in welchen Einheiten er die Variable 'hor' verwenden soll. Für die anderen Koordinatenangaben gilt natürlich sinngemäß das gleiche...
-
Danke für die schnellen Antworten (=
jetzt funktioniert auch alles, so wie es sein soll^^.