黒背景 Fork

    @@ -3,63 +3,65 @@ * @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) { + (()=>{ + 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); - my_style.setAttribute('mode_stat', 1); + console.log('0'); - console.log('2'); + break; - break; + case 1: - default: + my_style.innerText = '*{background-color:#000!important}'; - alert('error mode_stat=' + mode); + if (my_style.getAttribute('all_elm_length') != all.length) { - break; + 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; + } + })()
  • /*
     * @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 です。