自动模糊图片

打开网站帖子时图片自动模糊,点击后显示正常

// ==UserScript==
// @name         自动模糊图片
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  打开网站帖子时图片自动模糊,点击后显示正常
// @author       你的名字
// @match        *://yaohuo.me/*
// @match        *://*.yaohuo.me/*
// @icon         https://yaohuo.me/css/favicon.ico
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    // 检查页面中的图片
    function blurImages() {
        const images = document.querySelectorAll('img'); // 获取所有图片
        images.forEach(img => {
            img.style.filter = 'blur(10px)'; // 设置模糊效果
            img.style.transition = 'filter 0.3s ease'; // 添加过渡效果

            // 添加点击事件移除模糊
            img.addEventListener('click', function () {
                img.style.filter = 'none'; // 取消模糊
            });
        });
    }

    // 初始执行一次
    blurImages();

    // 监听动态加载内容
    const observer = new MutationObserver(mutations => {
        mutations.forEach(mutation => {
            if (mutation.addedNodes.length > 0) {
                blurImages();
            }
        });
    });

    // 监听整个页面的变化
    observer.observe(document.body, { childList: true, subtree: true });
})();