懒人之家--可能是JS网页特效代码收集最全的懒站!
更多

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

作者/代码整理:懒人  (转载请附加本文地址,带有“懒人原生”字样的谢绝转载) 发布日期:2014-12-26
效果描述:
默认图片是彩色效果,当鼠标悬停在图片上后,图片变成灰白色
(注意:不兼容IE10)
原理:
其实只要给图片悬停的hover效果加一个样式即可,即 filter: grayscale(100%);
使用方法:
1、将css样式引入到你的网页中
2、将body中的代码部分拷贝到你需要的地方即可
(图片采用绝对路径,不建议修改路径)