css3 filter属性

css3 filter的效果可以加在html5的video标签,也可以加在image图片上。

css3 filter的一些属性运用到js中: 

                    $ ('#video').css("-webkit-filter","sepia(100%)");

                    $('#video').css("-webkit-filter","blur(3px)");

                    $('#video').css("-webkit-filter","grayscale(50%)");

                    $('#video').css("-webkit-filter","brightness(2.5)");

                    $('#video').css("-webkit-filter","contrast(5)");

                    $('#video').css("-webkit-filter","hue-rotate(180deg)");

                    $('#video').css("-webkit-filter","invert(100%)");

                    $('#video').css("-webkit-filter","grayscale(100%) brightness(100%) contrast(100%)");
                    //saturate(250%)
                    //grayscale(100%) brightness(10%) contrast(100%) 黑白

                    $('#video').css("-webkit-filter","saturate(3)");

在css中也可以直接写id或class然后 : { -webkit-filter: sepia(100%);  } 

如果想移除filter效果可以用:

                    $('#video').css("-webkit-filter","none");

                    

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值