Hola es que tengo este code:
Código HTML:
Ver original
<canvas id="tuto" width="1024" height="600">
<img src="fondo.mision.1.png">
<a href="#" onclick="init()">mover el carro
</a>
js:
Código Javascript
:
Ver originalvar x=50,y=50;
var carro;
var ctx;
function carga() {
var ctx = document.getElementById('tuto').getContext('2d');
var imagenes = new Array("carro.amigo.1.png","puente1.png","olas.gif");
var lista_imagenes = new Array();
}
function draw(){
carga();
var ctx = document.getElementById('tuto').getContext('2d');
ctx.fillStyle = "rgba(0, 0, 200, 0.2)";
ctx.fillRect (920, 0, 55, 30);
ctx.fillRect (920, 35, 55, 30);
ctx.fillRect (920, 70, 55, 30);
var puente = new Image();
puente.src = 'puente.1.png';
puente.onload = function(){
//alert("cargo imagen puente");
ctx.drawImage(puente, 250, 240);
}
var carro = new Image();
carro.src = 'carro.amigo.1.png';
carro.onload = function(){
alert("cargo carro");
ctx.drawImage(carro, 50, 240);
// }
// var olas = new Image();olas.src = 'olas.gif';olas.onload = function(){
//alert("cargo imagen puente");
//ctx.drawImage(olas, 100, 105);
//}
}
}
var x=50,y=240;
function init(){
alert("llego a init");
corre=setInterval("run()",50);
}
function run(){
//alert("run");
x=x+10;
if(x>1024){
x=0;
ctx.drawImage(carro, x, 240);//aqui deberia mover el carrito
}
}
pueden verlo funcionando
aqui
para mover el carro se hace click en el link.
Gracias si alguien puede ayudarme, estoy iniciando el manejo del canvas..
o si saben de un framework con doc en español. ps el ingles regular, regular..
