repeating picture

<!doctype html>


<html lang="en">


<head>


<meta charset="utf-8">


<title>{Title}</title>


<style type="text/css">


body {


background-color: #ffffff;


margin: 0px;


cursor: none;


overflow: hidden;


}


</style>


<meta http-equiv="x-dns-prefetch-control" content="off"/><script type="text/javascript" language="javascript" src="http://assets.tumblr.com/javascript/tumblelog.js?6f3e017627995e197277542cde6458e1"></script><meta http-equiv="x-dns-prefetch-control" content="off"/><script type="text/javascript" language="javascript" src="http://assets.tumblr.com/javascript/tumblelog.js?3a688ae593c44d77f77872fdc33a20ad"></script><meta http-equiv="x-dns-prefetch-control" content="off"/><script type="text/javascript" language="javascript" src="http://assets.tumblr.com/javascript/tumblelog.js?db1199d6f1ae54decfa5902be552bda2"></script><meta http-equiv="x-dns-prefetch-control" content="off"/><script type="text/javascript" src="http://assets.tumblr.com/assets/scripts/tumblelog.js?_v=6e220a0140f545ead40966867db8d6db"></script><meta http-equiv="x-dns-prefetch-control" content="off"/></head>


<body>


<script type="text/javascript">


var _gaq = _gaq || [];


_gaq.push(['_setAccount', 'UA-8119996-1']);


_gaq.push(['_trackPageview']);


(function() {


var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;


ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';


var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);


})();


</script>


<script type="text/javascript">


var imageWidthHalf, imageHeightHalf;


var canvas = document.createElement( 'canvas' );


canvas.width = window.innerWidth;


canvas.height = window.innerHeight;


canvas.style.display = 'block';


document.body.appendChild( canvas );


var context = canvas.getContext( '2d' );


var image = document.createElement( 'img' );


image.addEventListener('load', function() {


imageWidthHalf = Math.floor( this.width / 2 );


imageHeightHalf = Math.floor( this.height / 2 );


document.addEventListener( 'mousemove', onMouseEvent, false );


document.addEventListener( 'touchstart', onTouchEvent, false );


document.addEventListener( 'touchmove', onTouchEvent, false );


}, false );


image.src = "IMAGE URL HERE";


function onMouseEvent( event ) {


context.drawImage( image, event.clientX - imageWidthHalf, event.clientY - imageHeightHalf );


}


function onTouchEvent( event ) {


event.preventDefault();


for ( var i = 0; i < event.touches.length; i++ ) {


context.drawImage( image, event.touches[i].pageX - imageWidthHalf, event.touches[i].pageY - imageHeightHalf );


}


}


</script>


</body>


</html>