Double Ctrl to zoom images like Edge browser
Versione datata
// ==UserScript==
// @name Double Ctrl Image Zoom (Edge Style)
// @namespace https://products.agarmen.com
// @version 1.01
// @description Double Ctrl to zoom images like Edge browser
// @match *://*/*
// @grant none
// @author @emberasim
// @license MIT
// ==/UserScript==
(function () {
'use strict';
let lastCtrlTime = 0;
const DOUBLE_PRESS_INTERVAL = 400; // ms
let overlayDiv = null;
let zoomedImg = null;
// Track mouse position
let mouseX = 0, mouseY = 0;
document.addEventListener('mousemove', e => {
mouseX = e.clientX;
mouseY = e.clientY;
});
// Create overlay
function createOverlay(imgSrc) {
disposeOverlay(); // remove old one if any
overlayDiv = document.createElement('div');
overlayDiv.style.position = 'fixed';
overlayDiv.style.top = 0;
overlayDiv.style.left = 0;
overlayDiv.style.width = '100vw';
overlayDiv.style.height = '100vh';
overlayDiv.style.backgroundColor = 'rgba(0,0,0,0.8)';
overlayDiv.style.display = 'flex';
overlayDiv.style.alignItems = 'center';
overlayDiv.style.justifyContent = 'center';
overlayDiv.style.zIndex = 999999;
//overlayDiv.style.cursor = 'zoom-out';
overlayDiv.style.backdropFilter = 'blur(2px)';
overlayDiv.style.opacity = '0';
overlayDiv.style.transition = 'opacity 0.2s ease';
zoomedImg = document.createElement('img');
zoomedImg.src = imgSrc;
zoomedImg.style.maxWidth = '90vw';
zoomedImg.style.maxHeight = '90vh';
zoomedImg.style.borderRadius = '8px';
zoomedImg.style.boxShadow = '0 0 20px rgba(0,0,0,0.6)';
zoomedImg.style.transition = 'transform 0.2s ease';
zoomedImg.style.transform = 'scale(1.05)';
overlayDiv.appendChild(zoomedImg);
document.body.appendChild(overlayDiv);
// Fade in
requestAnimationFrame(() => (overlayDiv.style.opacity = '1'));
// Close handlers
overlayDiv.addEventListener('click', disposeOverlay);
document.addEventListener('keydown', escListener, { once: true });
}
function escListener(e) {
if (e.key === 'Escape') disposeOverlay();
}
function disposeOverlay() {
if (overlayDiv) {
overlayDiv.style.opacity = '0';
setTimeout(() => {
if (overlayDiv) overlayDiv.remove();
overlayDiv = null;
zoomedImg = null;
}, 200);
}
}
// Detect double Ctrl
window.addEventListener('keydown', (e) => {
if (e.key === 'Control') {
const now = Date.now();
if (now - lastCtrlTime < DOUBLE_PRESS_INTERVAL) {
// get elements under the mouse pointer
const elems = document.elementsFromPoint(mouseX, mouseY);
const hoveredImg = elems.find(el => el.tagName && el.tagName.toLowerCase() === 'img');
if (hoveredImg) {
//console.log('IMG Tag Found:', hoveredImg.src);
createOverlay(hoveredImg.src);
e.preventDefault();
}
}
lastCtrlTime = now;
} else if (e.key === 'Escape') {
disposeOverlay();
}
});
})();