Как изменить курсор в зависимости от положения мыши?

Question

Я хотел бы изменить курсор с default на pointer, когда мышь вводит прямоугольник (50, 50, 100, 100) элемента body (цифры указаны в пикселях).

Я знаю, что мог бы определить div, поместить его в эту позицию и установить cursor: pointer;, но я ищу какой-то способ без определения div.

Я бы хотел что-то вроде:

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

Возможно ли это сделать?

Answer 1

Попробуйте что-то вроде этого (не проверено):

$("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 ...: (