javascript - 如何在单击按钮时将网页设置为灰度颜色模式

标签 javascript css

在我的网站中,我在一个 div 标签内使用了很多不同颜色的图像、表格和字体。当用户单击按钮时,整个网页应更改为灰度颜色模式。在那种模式下,用户应该仍然能够使用该页面。

我用的是IE

filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

它工作正常,但在 Mozilla Firefox 中不工作。

我找到了 this link .他们只提供将图像转换为灰度的脚本。但我需要转换一个完整的 div 标签,其中包含许多内容,例如图像、字体等。

提前致谢..

最佳答案

你可以尝试使用 Canvas :

http://www.permadi.com/tutorial/jsCanvasGrayscale/index.html

或者使用单独的 css 是这样的: body 类=“颜色” body 类=“bw”

并在你的 CSS 中定义“bw”

对于您使用 javascript 更改源的所有图像: src=foo.jpg src=foo_bw.jpg

关于javascript - 如何在单击按钮时将网页设置为灰度颜色模式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7212945/

相关文章:

Javascript 正则表达式 - 匹配句子中的单词与 "+"字符

javascript - 分别为每个元素运行 jQuery 函数

javascript - Rgd : Dual Horizontal Slider

html - 如何创建Hotmail "Sign in"按钮样式?

html - 我怎样才能重复图像翻转并在我的网站下方对齐多个图像?

javascript - 使用 jquery 获取元素的滚动百分比

javascript - 使用 gulp 查看文件夹中的多个文件

html - 奇怪的行为 - img 显示 :block vs img display:inline-block

css - 将图像定位在可变高度 div 的底部

javascript - 通过 Google Apps 脚本向 Discord channel 发送消息