除了Pixastic或jquery扩展之外,还有其他javascript库可以模糊图像吗?
情况:我有一页搜索结果。结果由一群用户组成。这些用户具有隐藏在按钮(display: none;
)下的图像列表。其中一些图片列表是私人的。私人的图片列表需要模糊掉。
尝试次数:我已经尝试过只使用firefox的css技巧,但似乎没有奏效。我已经尝试过Pixastic的库,快速模糊和普通模糊,但这首先给了我一个错误,因为我传递了一个jquery对象。但当我把它改成DOM对象时,它就是不起作用(但没有出现更多错误)。最后,我尝试使用他们实际演示中使用的代码(通过firebug获得),在js中创建一个图像,创建模糊效果处理程序并附加图像,但这只是附加了图像,而不是模糊。
规格:我在coldfusion工作,所以我想试试ImageBlur()
,但由于它必须出现在搜索结果页面中,所以模糊服务器端的那么多图像可能不是一个好主意。。
更新:我正在尝试使用blur.js,它似乎运行良好。但当我第二次调用used函数(jqueryelement.blurjs();
)时,我的第一个图像不会变得模糊(它确实经过库处理,得到了正确大小的背景,但没有图像),但第二个图像会变得模糊。如果我动态构建javascript字符串服务器端,这意味着只有最后一个图像会变得模糊。:\
这里有一些进行模糊处理的指针:
使用jQuery 的高斯模糊悬停
特别是Quasimodo的回答,他制作了一个模糊函数,用于这个jQuery插件:
http://blurjs.com/
您可以始终使用半新的CSS3 filter
属性。
filter: blur(10px);
过滤器是完全可设置动画的,适用于大多数浏览器(如您所见,除IE外的所有浏览器)。此外,对于大多数浏览器,您还需要-webkit-
前缀。
jsfiddle