Hide all Images, videos on all websites, hover to show
// ==UserScript==
// @name Hide Images
// @namespace http://tampermonkey.net/
// @version 2026-05-19
// @description Hide all Images, videos on all websites, hover to show
// @author wcx19911123
// @match http*://*/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=pronhub.com
// @run-at document-start
// @grant none
// @license MIT
// ==/UserScript==
(function () {
'use strict';
const opacitySelector = "img, canvas, video, svg";
const backGroundImageSelector = "[style*='background-image'], div, span, a, i, section, li, *:before, *:after";
const backgroundColorSelector = "[style*='background-color'], div, span, a, section, article, aside, header, footer, button, input, textarea, select, table, tr, th, td";
const targetAlpha = 0.15;
const showAfter = 500;
let hoverTimer = null;
const css = `
.force-hidden-image {
opacity: 0 !important;
/*visibility: hidden !important;*/
transition: opacity 0.3s !important;
}
.force-hidden-bg {
background-image: none !important;
}
`;
const style = document.createElement('style');
style.innerHTML = css;
(document.head || document.documentElement).appendChild(style);
function handleOpacity(el, toHidden) {
if (!el || !el.matches || !el.matches(opacitySelector)) return;
el.classList[toHidden ? 'add' : 'remove']("force-hidden-image");
}
function handleBGImage(el, toHidden) {
if (!el || !el.matches || !el.matches(backGroundImageSelector)) return;
el.classList[toHidden ? 'add' : 'remove']("force-hidden-bg");
}
function handleBGColor(el, toHidden) {
if (!el || !el.matches || !el.matches(backgroundColorSelector)) return;
if (toHidden) {
if (el.dataset.bgModified !== 'true') {
const currentBg = window.getComputedStyle(el).backgroundColor;
if (currentBg && currentBg !== 'transparent' && currentBg !== 'rgba(0, 0, 0, 0)') {
const matches = currentBg.match(/\d+/g);
if (matches && matches.length >= 3) {
el.dataset.originalBg = currentBg;
const [r, g, b] = [...matches];
el.dataset.newBg = `rgba(${r}, ${g}, ${b}, ${targetAlpha})`;
el.style.setProperty('background-color', el.dataset.newBg, 'important');
el.dataset.bgModified = 'true';
}
}
} else if (el.dataset.newBg) {
el.style.setProperty('background-color', el.dataset.newBg, 'important');
}
} else if (el.dataset.originalBg) {
el.style.setProperty('background-color', el.dataset.originalBg, 'important');
}
}
function handleTree(root = document.body, toHidden) {
if (!root || !root.matches || !root.querySelectorAll) return;
const handleList = function (selector, handleFunc) {
let list = [...root.querySelectorAll(selector)];
if (root.matches(selector)) list.unshift(root);
list.forEach(el => handleFunc(el, toHidden) || hover2Show(el));
};
handleList(opacitySelector, handleOpacity);
handleList(backGroundImageSelector, handleBGImage);
handleList(backgroundColorSelector, handleBGColor);
}
window.addEventListener('load', () => handleTree(document.body, true));
const observer = new MutationObserver(mutations => {
mutations.forEach(mutation => {
if (mutation.type === 'childList') {
mutation.addedNodes.forEach(node => handleTree(node, true));
} else if (mutation.type === 'attributes' && mutation.target.dataset.bgModified !== 'true') {
handleBGColor(mutation.target, true);
}
});
});
observer.observe(document.documentElement, {
childList: true,
subtree: true,
attributes: true,
attributeFilter: ['class', 'style'],
});
function hover2Show(el) {
if (!el || !el.matches || el.dataset.addedHover2Show === 'true') return;
el.dataset.addedHover2Show = 'true';
el.addEventListener('mouseenter', e => {
e.stopPropagation();
clearTimeout(hoverTimer);
hoverTimer = setTimeout(() => {
if (el.matches(opacitySelector)) handleOpacity(el, false);
if (el.matches(backGroundImageSelector)) handleBGImage(el, false);
if (el.matches(backgroundColorSelector)) handleBGColor(el, false);
}, showAfter);
});
el.addEventListener('mouseleave', e => {
e.stopPropagation();
clearTimeout(hoverTimer);
if (el.matches(opacitySelector)) handleOpacity(el, true);
if (el.matches(backGroundImageSelector)) handleBGImage(el, true);
if (el.matches(backgroundColorSelector)) handleBGColor(el, true);
});
}
})();