X/Twitter 视图优化

优化 Twitter 图片和视频的占位问题,不影响转发推文文本

当前为 2023-12-13 提交的版本,查看 最新版本

// ==UserScript==
// @name         X/Twitter 视图优化
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  优化 Twitter 图片和视频的占位问题,不影响转发推文文本
// @author       404 KIDS SEE GHOSTS
// @match        https://twitter.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=twitter.com
// @grant        GM_addStyle
// @license      MIT
// ==/UserScript==

(function () {
    // 添加自定义样式
    GM_addStyle('.r-1ssbvtb { width: 50% }');

    const callback = function (mutationsList, observer) {
        for (let mutation of mutationsList) {
            if (mutation.type === 'childList' && mutation.addedNodes.length) {
                mutation.addedNodes.forEach(node => {
                    // 检查是否为图片或视频容器
                    if(node.matches('.r-1ssbvtb')) {
                        // 当容器小于特定宽度时,调整宽度为自动
                        if(node.offsetWidth < 300) {
                            node.style.width = 'auto';
                        }
                    }
                });
            }
        }
    };

    // 设置 MutationObserver 以监视 DOM 变更
    const observer = new MutationObserver(callback);
    const targetNode = document.querySelector('#react-root');
    observer.observe(targetNode, { childList: true, subtree: true });
})();