 |
Die letzten 5 Postings in diesem Thema » Alle anzeigen
| von chip |
| Dabei fällt mir gerade auf, dass es so auch nicht funktionieren kann, weil keycode natürlich undefiniert ist und erst an einen Event-Listener gebunden werden muss. |
| von chip |
In der Methode getElementById() steht der erste Parameter für ein durch einen eindeutigen Bezeichner identifizierbares Element.
Du musst also in den Body beispielsweise ein DIV einfügen, dass eine ID trägt, die du dann in deinem Script benutzen kannst.
Also z.B. so:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57: | <html>
<head>
<script type="text/javascript">
function los() {
document.getElementById("meinbild").style.left="20"
document.getElementById("meinbild").style.top="20"
var xpos=x;
var ypos=y;
if (keycode==39) {
xpos=+10;
}
if (keycode==37) {
xpos=-10;
}
if (keycode==38) {
ypos=+10;
}
if (keycode==40) {
xpos=-10;
}
if (keycode==39 && keycode=38) {
xpos=+10;
ypos=+10;
}
if (keycode==37 && keycode=40) {
xpos=-10;
ypos=-10;
}
if (keycode==39 && keycode=40) {
xpos=+10;
ypos=-10;
}
if (keycode==37 && keycode=38) {
xpos=-10;
ypos=+10;
}
}
</script>
</head>
<body onKeydown=los()>
<div id="meinbild"><img src="bild.jpg" /></div>
</body>
</html> |
Leider kann ich aber nicht sehen, wie dein Script das Bild bewegen soll, weil dem Bild keine neuen Koordinaten zugewiesen werden.
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41: | <script type="text/javascript">
document.getElementById("meinbild").style.left="20";
document.getElementById("meinbild").style.top="20";
function los() {
if (keycode==39) {
document.getElementById("meinbild").style.left += 10;
}
if (keycode==37) {
document.getElementById("meinbild").style.left -= 10;
}
if (keycode==38) {
document.getElementById("meinbild").style.top += 10;
}
if (keycode==40) {
document.getElementById("meinbild").style.left -= 10;
}
if (keycode==39 && keycode=38) {
document.getElementById("meinbild").style.left += 10;
document.getElementById("meinbild").style.top += 10;
}
if (keycode==37 && keycode=40) {
document.getElementById("meinbild").style.left -= 10;
document.getElementById("meinbild").style.top -= 10;
}
if (keycode==39 && keycode=40) {
document.getElementById("meinbild").style.left += 10;
document.getElementById("meinbild").style.top -= 10;
}
if (keycode==37 && keycode=38) {
document.getElementById("meinbild").style.left -= 10;
document.getElementById("meinbild").style.top += 10;
}
}
</script> |
So sollte es aber funktionieren (nicht getestet!). |
| von jolenechen |
Hey,
uuund zwar will ich ein Bild mit den Pfeiltasten steuern können, d.h. nach links rechts oben und unten.
Problem ist, dass ich ja bei getElementById("") das Bild in diese Klammern einsetzen soll. Nur ist das ja keine URL sondern einfach name.jpg oder so, aber das funktioniert ja nicht einfach so.
Wie geht das nu?
<html>
<head>
<script type="text/javascript">
function los() {
document.getElementById("").style.left="20"
document.getElementById("").style.top="20"
var xpos=x;
var ypos=y;
if (keycode==39) {
xpos=+10;
}
if (keycode==37) {
xpos=-10;
}
if (keycode==38) {
ypos=+10;
}
if (keycode==40) {
xpos=-10;
}
if (keycode==39 && keycode=38) {
xpos=+10;
ypos=+10;
}
if (keycode==37 && keycode=40) {
xpos=-10;
ypos=-10;
}
if (keycode==39 && keycode=40) {
xpos=+10;
ypos=-10;
}
if (keycode==37 && keycode=38) {
xpos=-10;
ypos=+10;
}
}
</script>
</head>
<body onKeydown=los()>
<
</body>
</html>
|
|
|
|
|
