Greasy Fork is available in English.
模拟手电筒
当前为
// ==UserScript==
// @name 手电筒
// @namespace http://tampermonkey.net/
// @version 0.1
// @description 模拟手电筒
// @author 伟大大
// @match https://learnku.com/articles/72938
// @icon https://www.google.com/s2/favicons?sz=64&domain=learnku.com
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
// 添加按钮
let Container = document.createElement('div');
Container.id = "sp-ac-container";
Container.style.position="fixed"
Container.style.top="40px"
Container.style['z-index']="999999"
Container.innerHTML =`<button id="myCustomize" style="position:absolute; left:30px; top:20px">手电筒</button>`
//绑定按键点击功能
Container.onclick = function (){
main.init();
return;
};
// 追加
document.body.appendChild(Container);
let main = {
init(){
document.querySelector('style').append(`canvas {position: fixed;left:0;top: 0;z-index: 9999;pointer-events: none;}`)
document.body.appendChild(document.createElement('canvas'))
const cvs = document.querySelector('canvas')
const ctx = cvs.getContext('2d')
cvs.width = document.documentElement.clientWidth
cvs.height = document.documentElement.clientHeight
const p = {
x: 0,
y: 0,
r: 50
}
document.onmousemove = e => {
p.x = e.clientX
p.y = e.clientY
render()
}
const render = () => {
ctx.beginPath()
ctx.clearRect(0, 0, cvs.width, cvs.height)
var radial = ctx.createRadialGradient(p.x,p.y,p.r,p.x,p.y,p.r * 3);
radial.addColorStop(0,'rgba(255, 255, 255, 0)');
radial.addColorStop(1,'rgba(0, 0, 0, 0.5)');
ctx.fillStyle = radial;
ctx.fillRect(0,0,cvs.width, cvs.height);
}
render()
window.onresize = () => {
cvs.width = document.documentElement.clientWidth
cvs.height = document.documentElement.clientHeight
render()
}
}
};
})();