<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Page</title>
<style>
html,body{
height:100%;
margin:0;
}
body{
overflow:hidden;
}
#div1{
position:absolute;
top:0;
right:0;
}
</style>
</head>
<body>
<canvas id="can1"></canvas>
<script>
var ww=window.innerWidth;
var wh=window.innerHeight;
var can1=document.getElementById("can1");
var ctx=can1.getContext("2d");
var img=new Image();
var x=240;
var y=120;
var step=0;
can1.setAttribute("width",ww);
can1.setAttribute("height",wh);
img.addEventListener("load",function(){
setInterval(run,100);
},false);
img.src="http://www.zeldagalaxy.com/wp-content/img/sprites/snes/lttp/link.png";
function run(){
//if(){
if(x>410){x=240};
if(step>ww){step=0};
ctx.clearRect(0,0,ww,wh);
ctx.drawImage(img,x,y,20,25,step,wh/2-20,20,25);
x=x+30;
step=step+2;
// }
};
</script>
</body>
</html>
</html>