JSFiddle - React, Tailwind, and code Playground
HTML
<canvas id="canvas" height="400" width="400"></canvas>
JavaScript
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
canvas.height = window.innerHeight;
canvas.width = window.innerWidth;
var images = new Array();
var currentLocation = 0;
var totalImages = 7;
for (var i = 0; i < totalImages; i++) {
var img = new Image;
switch (i) {
case 0:
img.src = "http://img.pokemondb.net/sprites/black-white/normal/mewtwo.png";
break;
case 1:
img.src = "http://img.pokemondb.net/sprites/black-white/normal/keldeo-ordinary.png";
break;
case 2:
img.src = "http://img.pokemondb.net/sprites/black-white/normal/darkrai.png";
break;
case 3:
img.src = "http://floatzel.net/pokemon/black-white/sprites/images/5.png";
break;
case 4:
img.src = "http://vignette1.wikia.nocookie.net/capx/images/0/03/001.png/revision/latest?cb=20140322003659";
break;
case 5:
img.src = "http://img.pokemondb.net/sprites/black-white/normal/absol.png";
break;
case 6:
img.src = "http://img.pokemondb.net/sprites/black-white/normal/dewgong.png";
break;
case 7:
img.src = "http://orig05.deviantart.net/e770/f/2013/008/c/6/froakie_by_baconboy914-d5qvrjo.gif";
break;
}
images.push(img);
}
function mousemove(e) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(images[Math.floor((Math.random() * (totalImages - 1)) + 1)], 100, 100, 400, 400);
}
canvas.onmousemove = mousemove;