大佬教程收集整理的这篇文章主要介绍了html5 – 在html画布上移动图像，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
var imgTag = null;
var x = 0;
var y = 0;
var id;
function doCanvas()
{
var canvas = document.getElementById('icanvas');
var ctx = canvas.getContext("2d");
var imgBkg = document.getElementById('imgBkg');
imgTag = document.getElementById('imgTag');
ctx.drawImage(imgBkg,0);
x = canvas.width;
y = 40;
id = seTinterval(moveImg,0.25);
}
function moveImg()
{
if(x <= 250)
clearInterval(id);
var canvas = document.getElementById('icanvas');
var ctx = canvas.getContext("2d");
ctx.clearRect(0,canvas.width,canvas.height);
var imgBkg = document.getElementById('imgBkg');
ctx.drawImage(imgBkg,0);
ctx.drawImage(imgTag,x,y);
x = x - 1;
}
任何建议？
var imgTag = new Image(); var canvas = document.getElementById('icanvas'); var ctx = canvas.getContext("2d"); var x = canvas.width; var y = 0; imgTag.onload = animate; imgTag.src = "http://i.stack.imgur.com/Rk0DW.png"; // load image function animate() { ctx.clearRect(0,canvas.height); // clear canvas ctx.drawImage(imgTag,y); // draw image at current position x -= 4; if (x > 250) requestAnimationFrame(animatE) // loop }
<canvas id="icanvas" width=640 height=180></canvas>
以上是大佬教程为你收集整理的html5 – 在html画布上移动图像全部内容，希望文章能够帮你解决html5 – 在html画布上移动图像所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。