如何根據鼠標位置更改光標？

Question

當鼠標進入body元素的矩形（50,50,100,100）時（數字以像素為單位），我想將光標從default更改為pointer 。

我知道我可以定義一個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 ...... :(