Собрал пример еще в пятницу, сейчас вот вспомнил..
Создаем sprite.html
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<title>Sprite Demo</title>
<body>
<canvas id="canvas" height="320" width="320" style="background:#000;"></canvas>
<div style="display:none;">
<img src="sprite.png" id="sprite"/>
</div>
<script type="text/javascript" src="sprite.js"></script>
</body>
</html>
Создаем sprite.js
Код:
var sprite = document.getElementById('sprite'); //берем изображение спрайта
var ctx = document.getElementById('canvas').getContext('2d'); //инициализируем канву
ctx.clearRect(0,0,320,320); // чистим область канвы, в данном случае всю канву
ctx.drawImage(sprite,100,100); // выводим спрайт на канве в координатах [100,100]
Не забудьте поместить в директорию проекта sprite.png, в прикреплении рабочий пример.
Лучшая благодарность - "Мне нравится", +1 или Like! Вверху страницы.
(Последний раз сообщение было отредактировано 16.02.2010 в 18:37, отредактировал пользователь all__.)