黒背景 Fork

    @@ -1,6 +1,6 @@ /* * @title 黒背景 - * @description サイトの背景を黒に、文字色を、元々の色の彩度を最大にしたものにします. 2種類モードがあり、実行するたび切り替わります:1.一番下の背景色が透明に、その他の要素の背景色が透明になります. 2.ほぼすべての要素の背景色が黒になります. + * @description サイトの背景を黒に、文字色を、元々の色の彩度を最大にしたものにします. 2種類モードがあり、実行するたび切り替わります:1.一番下の背景色が透明に、その他の要素の背景色が透明になります. 2.ほぼすべての要素の背景色が黒になります. 1より見た目は悪いです. * @javascript_url */ let my_style,
  • /*
     * @title 黒背景
     * @description サイトの背景を黒に、文字色を、元々の色の彩度を最大にしたものにします. 2種類モードがあり、実行するたび切り替わります:1.一番下の背景色が透明に、その他の要素の背景色が透明になります. 2.ほぼすべての要素の背景色が黒になります. 1より見た目は悪いです.
     * @javascript_url
     */
    let my_style,
        all = document.querySelectorAll('*'),
        mode = (my_style = document.querySelector('.dark_visited_style')) ? Number(my_style.getAttribute('mode_stat')) : 0,
        set_color = elm => {
            elm.forEach((v) => {
                let c = window.getComputedStyle(v).getPropertyValue('color'),
                    c_ob = {
                        r: Number(c.replace(/rgba?\((\d{1,3}), \d{1,3}, \d{1,3}.*/, '$1')),
                        g: Number(c.replace(/rgba?\(\d{1,3}, (\d{1,3}), \d{1,3}.*/, '$1')),
                        b: Number(c.replace(/rgba?\(\d{1,3}, \d{1,3}, (\d{1,3}).*/, '$1')),
                    };
                let s = 255 - Math.max(c_ob.r, c_ob.g, c_ob.b);
                v.style.color = `rgb(${c_ob.r+s}, ${c_ob.g+s}, ${c_ob.b+s})`;
            });
        },
        set_color_all = (style = my_style_text) => {
            set_color(all);
            document.querySelectorAll('iframe').forEach((v) => {
                if (v.src && (new URL(v.src, location)).origin == location.origin || v.src == 'about:blank') {
                    set_color(v.contentDocument.querySelectorAll('*'));
                    let my_style = v.contentDocument.createElement("style");
                    my_style.innerText = style;
                    v.contentDocument.body.appendChild(my_style);
                }
            })
        };
    const my_style_text = 'a:visited{color:#b553ff!important;}:not(html){background-color:transparent!important}html{background-color:#000!important}::-webkit-scrollbar{overflow:hidden;width:.8rem;background:#000;}::-webkit-scrollbar-thumb{overflow:hidden;border-radius:.4rem;background:#ddd;}';
    switch (mode) {
        case 0:
            set_color_all();
            my_style = document.createElement("style");
            my_style.className = 'dark_visited_style';
            my_style.innerText = my_style_text;
            document.body.appendChild(my_style);
            my_style.setAttribute('all_elm_length', all.length);
            my_style.setAttribute('mode_stat', 1);
            console.log('0');
            break;
        case 1:
            my_style.innerText = '*{background-color:#000!important}';
            if (my_style.getAttribute('all_elm_length') != all.length) {
                set_color_all('*{background-color:#000!important}');
                my_style.setAttribute('all_elm_length', all.length);
            }
            my_style.setAttribute('mode_stat', 2);
            console.log('1');
            break;
        case 2:
            my_style.innerText = my_style_text;
            if (my_style.getAttribute('all_elm_length') != all.length) {
                set_color_all();
                my_style.setAttribute('all_elm_length', all.length);
            }
            my_style.setAttribute('mode_stat', 1);
            console.log('2');
            break;
        default:
            alert('error  mode_stat=' + mode);
            break;
    }
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。