How do I make a object that moves with mouse pointer?

Question

I was learning JS and I reached the part of addEventListener and after learning it I got an idea of making a gamr.But for that game I want a object inside a html canvas that moves along mouse pointer.I thought I can do it by
mouseover but I can't think of a function that makes the object move along the mouse pointer

Also pls tell how to make that object stay in a boundary for e.g. inside 100px by px square
Pls help

Answer 1

https://code.sololearn.com/WmYLHytqMM5J/?ref=app

Answer 2

Then will it move at the position where cursor is??

Pls also anawer my query mentioned in last 4 lines of question description

Answer 3

Can you pls tell the canvas.offset thing clearly.

So if my canvas dimension is
Width: 200 px
Height:200 px
So my canvas.offset would be

Answer 4

The below statement is quite of noob .But I can't just think of this.Sorry

What would be the left margin of my canvas if the width and height are 200,200.Pls tell

Answer 5

Oh thanks
Now I understood the concept