jquery模糊插件-Foggy

所属分类:媒体-图像

 32837  336  查看评论 (4)
分享到微信朋友圈
X
jquery模糊插件-Foggy ie兼容8

Foggy是一种模糊的页面元素的jQuery插件, 

它支持IE(8),火狐,Safari和Chrome浏览器。

使用步骤

默认值

$('.your-selector').foggy();

定制

$('.your-selector').foggy({
   blurRadius: 2,          // 像素.
   opacity: 0.8,           // 不透明度
   cssFilterSupport: true  // 使用“-webkit的过滤器”
 });

关闭

$('.your-selector').foggy(false);

它是如何工作的

雾默认使用 “-webkit的过滤器:模糊” CSS属性。


如果浏览器不支持它,Foggy回落到手动模糊。它使所选的HTML元素的多个副本。增加了所有的复制和移动他们每个人少量的透明度,从而造成的模糊效果。

相关插件-图像

canvas图片+文字合成

canvas图片+文字合成,实现照片合成效果,界面有点丑但是功能OK的。
  图像
 47328  362

jQueryphotoClip图片剪裁插件

jQueryphotoClip是一款支持移动设备触摸手势的图片裁剪jQuery插件。
  图像
 81342  418

橡皮擦--图片擦除效果

电脑端、移动端(Android、ios等)都可适应!
  图像
 51804  444

html5前端图片压缩

html5前端图片压缩
  图像
 85193  454

讨论这个项目(4)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    dswkroom 0
    2017/3/30 16:40:48

    IE8下显示不出来效果是什么鬼?

    回复
    Escape 0
    2015/12/9 9:12:33

    乱扯..一个纯样式写个js 有必要吗?ie 根本不支持

        黄文博0
        2016/11/9 11:11:44
        css 模糊怎么弄????????????它这个拆件怎么到我这里达不到模糊的效果
        dswkroom1
        2017/3/30 16:42:08
        .bg-blur{
        	float:left;
        	width:100%;
        	background-repeat:no-repeat;
        	background-position:center;
        	background-size:auto;
        	-webkit-filter:blur(15px);
        	-moz-filter:blur(15px);
        	-o-filter:blur(15px);
        	-ms-filter:blur(15px);
        	filter:blur(15px);
        }
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复