如何切换过滤器?

时间:2017-07-31 12:13:48

标签: javascript css

如何正确切换过滤器?

我需要一个能将我的页面变成倒黑色和白色的功能。当我再次运行该函数时,它应该将其恢复为原始颜色。

这是我到目前为止所拥有的:

function ToggleAccessibility() {
    if (!blackAndWhite) {
        (function () {
            var body = document.body;
            body.style['filter'] = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1 invert(100%))';
            if (!body.style['filter']) {
                body.style['-webkit-filter'] = 'grayscale(1) invert(100%)';
                body.style['filter'] = 'grayscale(1) invert(100%)';
            }
            blackAndWhite = true;
        }());
    }
    else {
        (function () {
            var body = document.body;
            body.style['filter'] = 'none';
            if (!body.style['filter']) {
                body.style['-webkit-filter'] = 'none';
                body.style['filter'] = 'none';
            }
            blackAndWhite = false;
        }());
    }
}

第一次运行该功能时,它正确地使页面反转为黑白。第二次,它正确地将屏幕恢复正常。

但之后它什么也没做。将过滤器设置为'none'似乎可以防止因某种原因对页面进行任何进一步更改。我不确定这是怎么回事。

1 个答案:

答案 0 :(得分:2)

+------------------------+-----------+------------+------------+
|          item          |    amt    |  txndate   | quarternum |
+------------------------+-----------+------------+------------+
| iPod Shuffle           | 130,0000  | 2012-04-03 |          1 |
| xBox One S             | 299,0000  | 2012-05-12 |          1 |
| iMac Pro               | 4999,0000 | 2012-07-23 |          2 |
| Flash Stick            | 4,5000    | 2012-08-01 |          2 |
| Pencils                | 3,6700    | 2012-10-23 |          3 |
| Markers                | 4,9900    | 2012-11-20 |          3 |
| Windex                 | 1,9900    | 2013-01-23 |          4 |
| echo dot               | 49,0000   | 2013-02-14 |          4 |
| Eggs                   | 3,9900    | 2013-04-12 |          5 |
| Strawberries           | 2,9900    | 2013-06-23 |          5 |
| Portable Generator     | 880,0000  | 2013-08-12 |          6 |
| Mattress Pad           | 103,9900  | 2013-09-03 |          6 |
| Power Drill            | 49,9900   | 2013-10-11 |          7 |
| GT Road GT             | 14,7700   | 2013-11-20 |          7 |
| QFit Bluetoot Speaker  | 25,9900   | 2014-01-31 |          8 |
| Toilet Night Light     | 8,9900    | 2014-02-23 |          8 |
| BS-MALL Makeup Brushes | 6,2900    | 2014-03-14 |          8 |
+------------------------+-----------+------------+------------+