浏览器变灰---祈福雅安

祈福雅安
雅安发生地震，需要大家热心的无私的帮助。希望大家心连心铸造爱心。为灾区人民献一份力量。谢谢大家。
作为一名打酱油烂的不能再烂的前端攻城师。


关于浏览器变灰的实现方式：
1、最干脆最直接的办法是把图片变灰。（适合少量修改图片，兼容有所的浏览器）
2、用滤镜（IE滤镜和css3滤镜）控制，如（能够修改所有元素（包括图片），兼容IE系列及webkit系列）

-webkit-filter:grayscale(100%);
-o-filter:grayscale(100%);
-ms-filter:grayscale(100%);
filter:grayscale(100%);    filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); 

3、用grayscale插件（官方网站：http://james.padolsey.com/javascript/grayscaling-in-non-ie-browsers/），
主要是通过canvas将图片转换成功灰色图片，利用data:image/png;base64，重新将src复制过去。
（兼容绝大部分浏览器，包括firefox。不过，建议只有让firefox调用grayscale插件，修改指定的图片。）
grayscale.js：http://james.padolsey.com/demos/grayscale/grayscale.js

在实际中可以根据需要选择哪种方式实现，变灰是一种爱，虽然不能创造什么，但是牵挂着我们每一个人的心。
祈福雅安

转载于:https://www.cnblogs.com/kuikui/archive/2013/04/22/3034772.html