如果想改变css背景图片,一般的做法只能使用css滤镜;
css滤镜主要包括:
Speia滤镜 灰度图滤镜 高斯模糊滤镜 反色滤镜 饱和度滤镜
对比度滤镜 亮度滤镜 色相旋转滤镜 阴影滤镜
css滤镜在浏览器兼容是比较坑爹的问题,ie浏览器有自己一套滤镜filter家族,基本所有ie内核浏览器都支持,ff和Chrome,opera则主要使用css3的滤镜,这些浏览器在后期版本支持css3的滤镜(目前版本基本都支持html5和css3),通过滤镜改变背景图的颜色和效果,当然这些滤镜主要是为了效果而产生,颜色只是固定的几种效果;了解更多可以参考:http://www.cnblogs.com/fsjohnhuang/p/4127888.html
个别时候,css滤镜还需要结合js使用,才能到达必要效果,其实一般背景图片都是用透明度的css来设置它的颜色度;
透明度css列子:
transparent_class {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}
用css的话,可以做两张图片,一张按一点的,然后设置鼠标移上去的时候显示暗的这张图片
jq可以实现 给你的DIV 设置个id 名字是id
$(document).ready(function(){
$('#id').click(function(){
$('img').css("filter","gray")
})
})
纯,css是没有事件的,必须借助脚本才能够动态实现。建议你用Jquery动态添加css的滤镜处理
怎么可能处理图片呢,除非你上面加一个DIV,做灰色设置下透明度