`
jeasony
  • 浏览: 200594 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

简单实现网站变灰的代码(JS)

    博客分类:
  • js
阅读更多

非常简单,在网页中增加如下代码:


<script type="text/javascript">
var ht = document.getElementsByTagName("html")[0];
ht.style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)";
</script>
( 只支持ie)

完整示例:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<img id="img1" src="http://blog.readnovel.com/image/style/logo_blogrn.gif" alt="文学博客" />
<font color="red">dsfsf</font>
</body>
</html>
<script type="text/javascript">...
<!-- 注意,开头的DOCTYPE描述不可少,否则对html的滤镜将不起作用,不过对body还是可以的 -->
var ht = document.getElementsByTagName("html")[0];
ht.style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)";
</script>

如果您的网页顶部没有加:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

那么你可以用:


<script type="text/javascript">
var ht = document.getElementsByTagName("body")[0];
ht.style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)";
</script>

赶紧加一下吧,为地震中遇难同胞哀悼……

分享到:
评论

相关推荐

    网站指定日期变灰色JS代码附带教程

    网站指定日期变灰色的JS代码是一种常见的网页设计技术,它通常用于表示哀悼、纪念特殊事件或节假日。这种效果可以通过JavaScript脚本实现,使整个网页背景变为灰色,以传达特定的情感氛围。以下将详细介绍如何使用JS...

    jquery网页变灰

    "jQuery 网页变灰"是一个常见的需求,它可以通过JavaScript库jQuery实现。本教程将深入讲解如何利用jQuery实现这一功能,并提供实例及源码供参考。 首先,理解jQuery的基本概念是必要的。jQuery是一个轻量级、高...

    lightbox弹出窗口背景变灰代码

    下面将详细解释如何实现这种“lightbox弹出窗口背景变灰”的效果。 首先,我们需要理解实现这个功能的关键元素: 1. **HTML 结构**:HTML 是页面的基础,我们需要创建一个或多个图像元素,当用户点击这些元素时...

    全站变灰代码 前端代码修改即可

    ### 全站变灰代码——前端代码修改方法详解 #### 概述 在特定场景下,例如纪念日或哀悼活动等,网站可能会选择将所有页面的颜色调整为灰色调,以此来表达一种庄重或哀悼的情感。实现这一功能通常需要通过前端技术,...

    适合清明使用的网页变灰白代码,亲测可用

    这里我们探讨的是一种使用JavaScript实现的网页变灰白的技术方案,该方案适用于前端开发,尤其在清明时节可以派上用场。本文将深入讲解如何利用JavaScript来改变网页的颜色,并提供亲测有效的代码示例。 首先,我们...

    哀悼日变灰操作

    我们可以提炼出与“哀悼日变灰操作”相关的IT知识点,但首先需要澄清的是,文件内容似乎包含了一些不相关的代码片段和文档,这些内容涉及一个名为"Guzz"的全栈数据层解决方案框架,以及一系列与数据库映射、服务接口...

    JavaScript实现点击按钮后变灰避免多次重复提交

    下面是一个简单的例子: 代码如下: &lt;html&gt; &lt;head&gt; &lt;title&gt;点击获取验证码按钮后按钮变灰,倒计时一段时间后又可重复点击&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;input type=”button” id...

    H5 页面整体变灰色的的代码

    为了实现特定场景下的页面变灰,我们可以在JavaScript中控制灰色屏幕的显示与隐藏。例如,当用户点击某个按钮或者执行特定操作时,通过改变`gray-screen`的`display`属性,我们可以实现页面从灰色变为正常,或者反之...

    默认图片灰色鼠标放上去变彩色css效果代码.rar

    本文将深入探讨如何使用CSS实现一种默认图片为灰色,当鼠标悬停时变为彩色的效果,以及这一技术在JS特效和图片相册中的应用。 首先,我们来理解CSS(Cascading Style Sheets)的作用。CSS是一种样式表语言,用于...

    JavaScript实现tab栏切换效果

    这个简单的 JavaScript 实现依赖于元素的索引和类名的管理,使得用户可以通过点击 Tab 标签轻松切换页面内容。这种功能在很多网页应用中都很常见,例如产品介绍、用户设置、数据统计等场景。 总的来说,这个示例...

    js 表单提交后按钮变灰的实例代码

    在提供的代码示例中,我们看到了一个简单的HTML表单结构,并且用到了JavaScript来实现提交后按钮变灰的功能。为了使内容更加详细丰富,以下是详细知识点的展开。 知识点一:HTML表单结构 在上述代码中,表单的结构...

    简易灰色逆波兰表达式计算器代码

    - `js` 文件可能是JavaScript代码,负责处理用户的输入,解析逆波兰表达式,以及更新页面显示的结果。 - 使用JavaScript的DOM(Document Object Model)操作,可以改变HTML元素的内容和样式。 6. **用户交互逻辑*...

    lightbox弹出窗口背景变灰代

    在实现lightbbox时,背景变灰效果是通过CSS样式来完成的。这个过程涉及到对HTML结构的理解,以及如何使用CSS选择器和属性来改变元素的外观。以下是一个简单的步骤和代码示例: 1. **HTML 结构**: 首先,我们需要...

    支持各种图片图变灰.zip

    "支持各种图片变灰.zip"压缩包文件提供了实现这一功能的详细代码,下面将深入探讨图片变灰的原理和实现方法。 图片的基本构成是像素,每个像素由红、绿、蓝(RGB)三种颜色通道组成,每种颜色的值范围通常在0到255...

    css滤镜实现鼠标悬停图片变黑白(灰色).zip

    这个“css滤镜实现鼠标悬停图片变黑白(灰色).zip”压缩包提供了一个实例,展示了如何利用CSS和JavaScript来实现一个交互式的图片处理效果:当鼠标悬停在图片上时,图片会变为黑白(或称灰色)。 首先,我们来看...

    默认图片是灰色鼠标放上去变彩色css效果代码

    对于这些浏览器,可能需要使用JavaScript或者jQuery等库来实现类似的效果。 总结,利用CSS的`filter`属性和`:hover`伪类选择器,我们可以轻松创建一个“默认灰色、鼠标悬停变彩色”的图片效果,提升网页的交互性和...

    jquery图片从灰色到彩色效果

    首先,jQuery是一个轻量级的JavaScript库,它简化了JavaScript编程,提供了一系列方便的API,使得处理DOM操作、事件监听、动画效果等变得更加简单。在这个特效中,我们将利用jQuery的事件监听和CSS样式修改功能。 ...

    javascript实现选中复选框后相关输入框变灰不可用的方法

    当用户选中一个复选框时,与之相关的输入框会变灰并不可用;取消选中时,输入框恢复可编辑状态。此方法对于有相关性的输入字段特别有用,可以有效地指导用户进行操作。 在实际开发中,我们可以根据需要调整这个示例...

    web网站置灰 哀悼 支持多firfox

    在提供的文件"grayscale11.js"中,我们可以推断这是一个JavaScript脚本,可能包含了实现网页灰度效果的代码。JavaScript可以用于监听特定事件(如页面加载或用户触发的事件),然后动态地将页面元素的颜色转换为灰色...

Global site tag (gtag.js) - Google Analytics