Hallo,
ich habe mir vor kurzem das Buch "Javascript" von Stefan Koch gekauft und habe mich da jetzt auch fast bis zum Ende durchgelesen. Mein Grund, Javascript zu erlernen war vor allen Dingen die Erstellung von Animationen ohne lästiges Flash. Nun habe ich mir das eigentlich ganz einfach vorgestellt.
Wie man unschwer erkennen kann, habe ich zwei Funktionen definiert. Einmal, die jede Sekunde die Funktion bewegen() aufruft und die andere, die dann eigentlich den Abstand des div-Blocks "test" um 20px erhöhen soll. Das Problem für mich ist, dass ich nicht weiß, wie ich zu dem vorherigen Wert also 20px weitere 20px hinzuaddieren kann. Also so, dass sich der Abstand von links quasi pro Sekunde um 20px erhöht. Ich habe schon folgendes probiert:
oder bspw.
Hat logischerweise alles nicht funktioniert, wäre ja auch zu einfach.
Kann mir da jemand helfen? Dass das Programm den Abstand links jede Sekunde um 20px erhöht?
Ich bedanke mich schon mal für Antworten & wünsche allerseits schöne Ostern !
ElementZ
ich habe mir vor kurzem das Buch "Javascript" von Stefan Koch gekauft und habe mich da jetzt auch fast bis zum Ende durchgelesen. Mein Grund, Javascript zu erlernen war vor allen Dingen die Erstellung von Animationen ohne lästiges Flash. Nun habe ich mir das eigentlich ganz einfach vorgestellt.
HTML:
<!DOCTYPE html>
<html>
<head>
* <meta charset="UTF-8">
* <meta name="viewport" content="width=device-width">
* <title>animation</title>
* <link rel="stylesheet" href="style.css" />
* <script>
function bewegen() {
var x = document.getElementById("test");
var abstand = x.style.left + 20;
}
function starten() {
meinInterval = setInterval("bewegen()", 1000);
}
</script>
</head>
<body
* <h1>animation</h1>
* <div id="test" style="background:black; width:20px; height:20px; position:absolute; left:20px;"></div>
<script>
starten();
</script>
</body>
</html>
Wie man unschwer erkennen kann, habe ich zwei Funktionen definiert. Einmal, die jede Sekunde die Funktion bewegen() aufruft und die andere, die dann eigentlich den Abstand des div-Blocks "test" um 20px erhöhen soll. Das Problem für mich ist, dass ich nicht weiß, wie ich zu dem vorherigen Wert also 20px weitere 20px hinzuaddieren kann. Also so, dass sich der Abstand von links quasi pro Sekunde um 20px erhöht. Ich habe schon folgendes probiert:
HTML:
function bewegen() {
var x = document.getElementById("test");
var abstand = x.style.left;
abstand + "20px";
}
HTML:
function bewegen() {
var x = document.getElementById("test");
x.style.left += "20px";
}
Hat logischerweise alles nicht funktioniert, wäre ja auch zu einfach.
Kann mir da jemand helfen? Dass das Programm den Abstand links jede Sekunde um 20px erhöht?
Ich bedanke mich schon mal für Antworten & wünsche allerseits schöne Ostern !
ElementZ