我开发了一个 Chrome 扩展程序，可以截取网页屏幕截图。我注意到，当我对某些页面进行屏幕截图时，屏幕截图中的鼠标消失了。因此我无法知道稍后点击发生在哪个地方。
如何解决这个问题？
最佳答案
您需要自己绘制鼠标光标。以下是单击鼠标进行屏幕截图并在光标所在位置绘制红色圆圈的示例:
content_script.js:
window.addEventListener("click", function(event) {
chrome.extension.sendRequest({x: event.x, y: event.y});
});
背景.html:
<html>
<head>
<script>
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
chrome.tabs.captureVisibleTab(null, {format:"png"}, function(dataUrl){
var img = new Image();
img.onload = function(){
var canvas = document.getElementById("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
ctx.arc(request.x, request.y, 5, 0, Math.PI*2, true);
ctx.fillStyle = "rgb(255,0,0)";
ctx.fill();
chrome.tabs.create({url: canvas.toDataURL("image/png")});
};
img.src = dataUrl;
});
sendResponse({});
});
</script>
</head>
<body>
<canvas id="canvas"></canvas>
</body>
</html>
关于javascript - 单击网页屏幕截图时鼠标消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6713096/