图片滤镜系列
------ 超级简单和轻量级,仅需引入一个js ------
原图展示
灰度滤镜 [0-100]
标签: < img src="img/1.png" class="gray_25" >
要求: 灰度25%
调用: $(".gray_25").grayImg(25);
< img src="img/1.png" class="gray_50" >
灰度50%
$(".gray_50").grayImg(50);
< img src="img/1.png" class="gray_75" >
灰度75%
$(".gray_75").grayImg(75);
< img src="img/1.png" class="gray_100" >
灰度100%
$(".gray_100").grayImg(100);
模糊滤镜 [0-n]
标签: < img src="img/1.png" class="dim_50" >
要求: 模糊50%
调用: $(".dim_50").dim(0.5);
标签: < img src="img/1.png" class="dim_100" >
要求: 模糊100%
调用: $(".dim_100").dim(1);
标签: < img src="img/1.png" class="dim_200" >
要求: 模糊200%
调用: $(".dim_200").dim(2);
标签: < img src="img/1.png" class="dim_300" >
要求: 模糊300%
调用: $(".dim_300").dim(3);
标签: < img src="img/1.png" class="dim_500" >
要求: 模糊500%
调用: $(".dim_500").dim(5);
亮度滤镜 [百分比]
标签: < img src="img/1.png" class="brightness_25" >
要求: 亮度25%
调用: $(".brightness_25").brightness(25);
标签: < img src="img/1.png" class="brightness_60" >
要求: 亮度60%
调用: $(".brightness_60").brightness(60);
标签: < img src="img/1.png" class="brightness_125" >
要求: 亮度125%
调用: $(".brightness_125").brightness(125);
标签: < img src="img/1.png" class="brightness_200" >
要求: 亮度200%
调用: $(".brightness_200").brightness(200);
对比度滤镜 [百分比]
标签: < img src="img/1.png" class="contrast_25" >
要求: 对比度25%
调用: $(".contrast_25").brightness(25);
标签: < img src="img/1.png" class="contrast_50" >
要求: 对比度50%
调用: $(".contrast_50").brightness(50);
标签: < img src="img/1.png" class="contrast_200" >
要求: 对比度200%
调用: $(".contrast_200").brightness(200);
色相旋转滤镜 [0-n]
标签: < img src="img/1.png" class="hueRotate_50" >
要求: 色相旋转50%
调用: $(".hueRotate_50").hueRotate(50);
标签: < img src="img/1.png" class="hueRotate_100" >
要求: 色相旋转100%
调用: $(".hueRotate_100").hueRotate(100);
标签: < img src="img/1.png" class="hueRotate_200" >
要求: 色相旋转200%
调用: $(".hueRotate_200").hueRotate(200);
饱和度滤镜 [0-n]
标签: < img src="img/1.png" class="saturate_50" >
要求: 饱和度50%
调用: $(".saturate_50").saturate(50);
标签: < img src="img/1.png" class="saturate_100" >
要求: 饱和度100%
调用: $(".saturate_100").saturate(100);
标签: < img src="img/1.png" class="saturate_200" >
要求: 饱和度200%
调用: $(".saturate_200").saturate(200);
标签: < img src="img/1.png" class="saturate_500" >
要求: 饱和度500%
调用: $(".saturate_500").saturate(500);
到底啦