Web page grayscale effect compatible with firefox and chrome_PHP tutorial

But from a technical point of view, the safest way to achieve web page grayscale is to directly process all images, without considering compatibility or efficiency. However, the workload is relatively large and switching back is also laborious.

ie series supports css filters. One sentence filter:gray; solves all problems. However, as we all know, ie is famous for its low efficiency, and you will find that the speed drops significantly after it is turned on. And, most fatally, it doesn't work in other browsers.

Is there a way to be compatible with all browsers? have. JavaScript can do it. Someone has long used js to simulate the gray filter of IE. If you are interested and willing to read English, you can check out "GRAYSCALING" IN NON-IE BROWSERS. If you don't want to read it, I can tell you directly how to use it.

1. Download grayscale.js file

2. Reference this js file in your header



3. To achieve site-wide grayscale, call

grayscale(document.body); in the onload event;

I have a lot of theme background pictures, which is difficult to process, and some pictures may disappear. . .

I will enable this effect for three days. Please forgive me if the theme display is abnormal due to processing problems and affects everyone's browsing experience. Anyway, those who come here are all acquaintances, and only a few of you can be influenced. . .

http://www.bkjia.com/PHPjc/324198.htmlwww.bkjia.comtruehttp: //www.bkjia.com/PHPjc/324198.htmlTechArticleOnly from a technical point of view, the safest way to achieve web page grayscale is to directly process all images without Consider compatibility, not efficiency. However, the workload is relatively large, switching...