Interactions with the mouse

The interactions with the mouse position are probably the simplest and most logical interactions. You just have to substitute the position that you have before(when it was static) by mouseX and mouseY (it seems logical to me what is the position of the X axis and which of the axis Y)

  var d = 100; //ball diameter
function setup(){
createCanvas(windowWidth, 400);
}

function draw(){
//clear background
	background(100);
//draw face
	fill('#FCD0B4');
	ellipse(mouseX,mouseY,d,d);
//draw eyes
	fill(0,0,255);
	ellipse(mouseX-d/6,mouseY-d/7,d/5,d/5);
	ellipse(mouseX+d/6,mouseY-d/7,d/5,d/5);
	fill(255,0,0,100);
	triangle(mouseX, mouseY-d/20, mouseX+d/12, mouseY+d/7, mouseX-d/12, mouseY+d/7);

//draw mouth
	fill(255,0,0);
	arc(mouseX,mouseY+d/4,d/2.5,d/4.5,0,PI,CHORD);
}