Blurr是一款基于图片的元素模糊背景特效jQuery插件。该插件根据图片的主要色彩,将元素的背景制作为这些色彩合成的模糊效果。色彩融合自然,有磨砂的效果,非常时尚好看。
浏览器支持
- IE 8/9 (partial)
- IE 9+ (full)
- Chrome (desktop/mobile)
- Firefox
- Opera
- Safari (desktop/mobile)
Windows版本的Safari不支持该插件。iPad上未作测试。
使用方法
使用该背景模糊插件先要引入jQuery和jquery.blurr.js文件。
HTML结构
该背景模糊特效插件的HTML结构是使用一个 在页面加载完毕之后,可以通过下面的方法来初始化该背景模糊插件。 下面是该背景模糊插件的一些可用参数:data-href
属性指向用于背景模糊的图片。然后在该
初始化插件
$(document).ready(function() {
$('.blur-this').blurr({
height: 300, // Height, in pixels of this blurred div.
sharpness: 40, // Sharpness, as a number between 0-100. 100 is very sharp, 0 is extremely blurry
offsetX: 0, // The x (left - right) offset of the image
offsetY: 0, // The y (top - bottom) offset of the image
callback: null // Callback to be called after the blur has been rendered. Recieves the following arguments (href, offsetX, offsetY, sharpness)
});
});
配置参数
#000
。
版权声明
版权说明: 仅限用于学习和研究目的;不得将上述内容用于商业和非法用途!否则一切后果自负。我们非常重视版权问题,如有侵权请邮件至(171373236#qq.com)与我们联系处理,敬请谅解!