javascript - Mouse disappers when screenshot of a webpage is clicked -
javascript - Mouse disappers when screenshot of a webpage is clicked -
i have developed chrome extension takes screenshots of webpages. have noticed when take screenshots of pages, mouse in screenshot disappears. hence not able know place did click occur later.
how resolved ?
you need draw mouse cursor yourself. here illustration of making screenshot on mouse click , drawing reddish circle cursor was:
content_script.js:
window.addeventlistener("click", function(event) { chrome.extension.sendrequest({x: event.x, y: event.y}); });
background.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 canvas google-chrome-extension screenshot webpage-screenshot
Comments
Post a Comment