Kann mir jemand mit clearInterval helfen? Ich habe stundenlang damit gearbeitet und kann es scheinbar nicht zur Arbeit bringen. Ich bin mit einem sehr ähnlichen Code zu dem, was ich auf W3 Schulen gefunden wie folgt:Javascript - clearInterval
Hier ist auch ein Link in Aktion zu sehen: http://hyque.com/ani/drawImageBtn.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>DrawImage with Buttons</title>
</head>
<body>
<button id="startBtn">Start</button>
<button id="stopBtn">Stop</button><br />
<canvas id="myCanvas" width="125" height="187" style="border:1px solid #d3d3d3;">
<script>
window.onload = function() {
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = new Image();
img.src = "http://hyque.com/ani/adam.png";
var xPos = 0;
ctx.drawImage(img, 0, 0, 120, 182, 0, 0, 120, 182);
var el = document.getElementById('startBtn');
el.addEventListener('click', strt, false);
var el2 = document.getElementById('stopBtn');
el2.addEventListener('click', stopIt, false);
function imageXPosition() {
ctx.clearRect(0, 0, 120, 182); // This clears the canvas
ctx.drawImage(img, xPos, 0, 120, 182, 0, 0, 120, 182); //Draws the individual frames
xPos += 120; //adds the width
//This adds 1 to the second frame
if(xPos == 120){
xPos += 1;
}
if(xPos > 841){xPos = 0;} // This resets to 0 after the las frame
}
function strt(){
var intStp = setInterval(imageXPosition, 200);
}
function stopIt(){
clearInterval(intStp);
}
}
</script>
</body>
</html>
"var intStp" ist lokal beschränkt nur innerhalb 'strt()'. Sie können nicht außerhalb dieser Funktion darauf zugreifen. – charlietfl