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.