是否可以检测鼠标何时位于浏览器选项卡上？

Question

我被分配了一个任务来制作一个脚本，当鼠标指针悬停在当前打开的浏览器选项卡上时，该脚本将生成一个弹出窗口。

演示内容类似：http : //demo.exitmonitor.com/，但是当鼠标离开网页顶部时，弹出窗口始终出现。

当鼠标悬停在我当前的活动浏览器选项卡上时，我需要准确地生成此窗口。

是否可以使用javascript执行此操作？

Answer 1

使用MouseEvent.clientX和MouseEvent.clientY跟踪鼠标在文档上的位置，然后使用absolute定位将弹出窗口放在那里：

//The popup:
var span = document.createElement("span");
span.style.position = "absolute";
span.textContent = "I'm a popup!";
//When the page loads, the popup will be in the top-left corner
//because we can't know where the mouse is on the page load.
document.body.insertBefore(span, document.body.firstChild);

//The event:
document.addEventListener("mousemove", function(e) {
    //Position the span according to its dimensions and where the mouse is.
    span.style.marginLeft = e.clientX-span.clientWidth/2+"px";
    span.style.marginTop = e.clientY-span.clientHeight/2+"px";
});