如何根据鼠标位置更改光标？

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