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");