Napisałem, na podstawie strony: http://www.doman.art.pl/kursjs/kurs/canvas/canvas_animacja.html , animację, ale nie działa ona prawidłowo. Czemu? Oto kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Moja animacja</title>
</head>
<body>
<canvas id="anim" width="400" height="300"></canvas>
<script type="text/javascript" src="anim.js"></script>
</body>
</html>
var animacja = document.getElementById("anim");
var wspolrzedna_x = 0;
var wspolrzedna_y = 0;
var przesuniecie_x = 2;
var przesuniecie_y = 2;
var kulka = new Image(25, 25);
kulka.onload = function()
{
setInterval('rysuj()', 30);
}
kulka.src = 'kulka.png';
function rysuj()
{
var kontekst = animacja.getContext('2d');
kontekst.clearRect(0, 0, 400, 300);
if (wspolrzedna_x < 0 || wspolrzedna_x > 400 - 25)
przesuniecie_x = -przesuniecie_x;
if (wspolrzedna_y < 0 || wspolrzedna_y > 300 - 25)
przesuniecie_y = -przesuniecie_y;
kontekst.drawImage(kulka, wspolrzedna_x, wspolrzedna_y);
}
OK, już wiem, głupi błąd :P Zapomniałem dodać ruchu kulki :D