Skip to content

Instantly share code, notes, and snippets.

@michaelBenin
Created June 9, 2012 21:00
Show Gist options
  • Save michaelBenin/2902582 to your computer and use it in GitHub Desktop.
Save michaelBenin/2902582 to your computer and use it in GitHub Desktop.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>
<body>
<canvas id='canvas' style="width:100%; height:100%;"></canvas>
</body>
<script type="application/javascript">
(function(){
var c = document.getElementById('canvas').getContext('2d'),
i = new Image();
i.src = 'http://xochi.info/XOCHI.INFO/flowers/M/mothers_day_momoko_queen_of_hearts-31px.png';
i.onload = function()
{
var l = 1;
var o = 90;
setInterval(function(){ move(o, 300, -200)}, 1000);
//move(o, 300, -200);
function move(x, y, z)
{
//alert(o);
var start = (new Date).getTime();
var duration = 2000;
var finish = start + duration;
var interval = setInterval(function()
{
var time = (new Date).getTime();
var pos = time>finish ? 1 : (time - start)/duration;
c.drawImage(i, x+(z*(-Math.cos(pos*Math.PI)/2)), 90+(y*(-Math.cos(pos*Math.PI)/2)));
if(time>finish)
{
clearInterval(interval);
l++;
if(l%2 ===0)
{
move(x, y, z*-1);
o = Number(o+10);
}
}
},10);
};
}
})();
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment