How to change the cursor based on the position of the mouse?

Question

I want to move the cursor from defaultto pointerwhen the mouse enters a rectangle (50, 50, 100, 100) of the element body(the numbers are in pixels).

I know that I could determine div, put it in this position and install it on it cursor: pointer;, but I'm looking for some way without defining it div.

I would like something like:

if (mousePosition inside rectangle) {
    change cursor to pointer
} else {
    change cursor to default
}

Can this be done?

Answer 1

Try something like this (unverified):

$("body").mousemove(function(e){
    if (e.pageX > 50 && e.pageY > 50 && e.pageX < 100 && e.pageY < 100)
        $("body").css("cursor", "pointer");
    else
        $("body").css("cursor", "default");
});

, , . CSS JS.

: style css...: (