И я думаю, что моя обновленная версия букмарклета Джейкоба намного лучше, чем та, на которую вы ссылались (тем более, что она сохраняет разнообразие цветов).

чание: я держу в своем вопросе актуальную версию букмарклета, которая хорошо работает и основана на ответе Джейкоба. Если вы ищете букмарклет для использования, используйте его. Посмотрите фантастический ответ leosok, если вы просто хотите что-то удивительное, что работает на Chrome.

Я хочу иметь возможность инвертировать цвет всех элементов на странице с помощью букмарклета JavaScript. Я знаю, что для инвертирования цвета вы вычитаете каждое из шестнадцатеричных значений RGB из 255 (xFF), но кроме этого я не уверен, как поступить.

Как я могу сделать это?

С помощьюjQuery Это приемлемо, и он должен работать только на Chrome, хотя, если бы он работал в Firefox, это было бы плюсом.

Это исключает изображения - цвета фона, текста и ссылок должны быть инвертированы. В основном все, что получает свой цвет от CSS.

ОБНОВИТЬ Вот обновленный букмарклет, который исправляет проблему вложенных элементов и будет работать на многих сайтах (включая этот)

UPDATE2 Добавлена ​​некоторая поддержка прозрачности, обработка элементов, которые имеют цвет фона по умолчанию rgba (0, 0, 0, 0). Больше сайтов должно работать сейчас с обновленным.

javascript: (function ($) {
    function load_script(src, callback) {
        var s = document.createElement('script');
        s.src = src;
        s.onload = callback;
        document.getElementsByTagName('head')[0].appendChild(s);
    }

    function invertElement() {
        var colorProperties = ['color', 'background-color'];
        var color = null;
        for (var prop in colorProperties) {
            prop = colorProperties[prop];
            if (!$(this).css(prop)) continue;
            if ($(this).data(prop) != $(this).css(prop)) continue;

            if (($(this).css(prop) === 'rgba(0, 0, 0, 0)') || ($(this).css(prop) === 'transparent')) {
                if ($(this).is('body')) {
                    $(this).css(prop, 'black');
                    continue;
                } else {
                    continue;
                }
            }
            color = new RGBColor($(this).css(prop));
            if (color.ok) {
                $(this).css(prop, 'rgb(' + (255 - color.r) + ',' + (255 - color.g) + ',' + (255 - color.b) + ')');
            }
            color = null;
        }
    }

    function setColorData() {
        var colorProperties = ['color', 'background-color'];
        for (var prop in colorProperties) {
            prop = colorProperties[prop];
            $(this).data(prop, $(this).css(prop));
        }
    }

    function invertColors() {
        $(document).live('DOMNodeInserted', function(e) {
            var $toInvert = $(e.target).find('*').andSelf();
            $toInvert.each(setColorData);
            $toInvert.each(invertElement);
        });
        $('*').each(setColorData);
        $('*').each(invertElement);
        $('iframe').each(function () {
            $(this).contents().find('*').each(setColorData);
            $(this).contents().find('*').each(invertElement);
        });
    }
    load_script('http://www.phpied.com/files/rgbcolor/rgbcolor.js', function () {
        if (!window.jQuery) load_script('https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js', invertColors);
        else invertColors();
    });

})(jQuery);

Теперь работает с большинством сайтов, которые я пробовал. Однако фоновые изображения могут создавать проблемы.

Ответы на вопрос(5)

Ваш ответ на вопрос