javascript - HTML5 Game jump() function not working properly -
i'm new canvas. i'm student developing runner game in canvas. have function jump()
, called when mousedown()
event occurs;
function jump(){ img= new image(); //is_jump=1; h.clearrect(20,430,170,250); img.onload= function(){ //h.drawimage(img,mx,my,190,280,120,410,190,350); h.drawimage(img,mx,my,190,350); //mx--; //my--; } img.src= "mario-copy.png"; h.clearrect(mx,my,190,350); //for(i=mx;i<130;i+=7) //{ if(mx<110&&my<480){ mx=(mx+5); my=(my-15); //settimeout(h.drawimage(img,mx,my,190,350),100000/5); h.drawimage(img,mx,my,190,350); }else{ mx=60; my=410; } }
the problem jumping character not working properly, jumps , not clear previous jumping state image while moving on.
so me out animation works , smoothly.
the goal make character jump click.
i think problem you're clearing , redrawing in same function of jump. creat seperate draw() , clear() , put inside setinterval , have run. then, jump function needs update position of object, can either directly having position being drawn changed jump(), or have seperate update() function before draw edit values.