random mouse pointer

by Pranab Dey

HTML

<div class="main">
	<div class="circle" id="circle"></div>
	<div class="circle"></div>
	<div class="circle"></div>
	<div class="circle"></div>
	<div class="circle"></div>
	<div class="circle"></div>
	<div class="circle"></div>
	<div class="circle"></div>
</div>
<img id="circle" src=""/>

CSS

body{
	margin:0;
}
.main .circle{
	display: inline-block;
	width: 20px; height: 20px; background: #333; border-radius: 50%;
}
#circle{
	border-radius: 50%; display: none; position: relative; background: red;
}

JavaScript

var di = document.getElementById("circle");
document.addEventListener("mousemove",function(e){
var x = e.clientX, y = e.clientY;
di.style.display = "block";
di.style.left = (x) + "px";di.style.top = (y) + "px";
})

/*document.addEventListener("click",function(){
	var arr = ["http://i.imgur.com/RLVsnq6.png",
	"http://vignette2.wikia.nocookie.net/transformice/images/b/b5/Xaniv_Lizard.png/revision/latest?cb=20160906140513",
	"http://ambiente.bocasdeltoro.org/imagenes/png-lizard8.png"]
	
	for(var i = 0; i<=arr.length-1;i++){
		di.src = arr[i];
		if(i==3) i=0;
	}
})*/