手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

重大灾难日网站变成灰色(素色)效果的实现

时间:2024-10-11 23:43:47

1、第一段代码(见图片):这段代码实现了谷歌、火狐、欧朋、微软最新浏览器Edge的灰色效果,但是safari和ie浏览器还不能实现。

重大灾难日网站变成灰色(素色)效果的实现

2、第二段代码(见图片):这段代码实现ie7-9灰色效果,但是ie10、ie11和safari还没有解决。

重大灾难日网站变成灰色(素色)效果的实现

3、第三段代码(见图片):为了实现ie10、ie11和safari浏览器的灰色效果,我引用了第鹩梏钔喔三方js文件GRAYSCA讣嘬铮篌LE.JS(grayscale.js是一个实现网页元素 “灰度” 效果的js插件,可以运行在大多数的浏览器中),只需把这个js文件下载及引入,写下面的代码就可以实现了。

重大灾难日网站变成灰色(素色)效果的实现

4、GRAYSCALE.JS很强大,在不需要上面代码骈禄笫杳解析的前两个步骤也能实现谷歌、火狐、欧朋、safari和ie9以上的灰色效果,配合上代码鞅瓞慈玢解析的第二个步骤就能实现大部分浏览器的灰色效果,但是可能会影响性能。

重大灾难日网站变成灰色(素色)效果的实现

5、以上三个步骤就能实现在特殊日子里的灰色(素色)效果,也可以直接用第二个和第三个步骤。总体代码(见图):

重大灾难日网站变成灰色(素色)效果的实现
重大灾难日网站变成灰色(素色)效果的实现
重大灾难日网站变成灰色(素色)效果的实现

6、最后效果(见图):

重大灾难日网站变成灰色(素色)效果的实现

7、希望能帮到需要的人!

© 手抄报圈