[英]Animate Fog / Blur effect in JQuery
I am using foggy Jquery plugin to blur text elements on my site. 我使用有雾的Jquery插件来模糊我网站上的文本元素。 I need a code that can get a number of seconds, and that will animate the blur effect from blurRadius X (see the link) to blurRadius: 1 (means regular text) across the time in seconds that I pass to the function.
我需要一个可以获得几秒钟的代码,这会将blurRadius X(请参阅链接)中的模糊效果设置为blurRadius:1(意味着常规文本),并在几秒钟内传递给函数。
So when I call the function and pass the time in seconds, it will animated the fog blur effect. 因此,当我调用函数并在几秒钟内传递时间时,它将为雾模糊效果设置动画。 Right now the library support a static effects out of the box.
现在,该库支持开箱即用的静态效果。 But if we use some type of timer this can animate the effect.
但是如果我们使用某种类型的计时器,这可以激活效果。 I need your help in a code that product this type of animation.
我需要你的代码中的帮助,以产生这种类型的动画。 Thanks.
谢谢。
I am open to other plugins. 我对其他插件持开放态度。 However, the Foggy plugin supports fallback for IE (use only opacity), which I need.
但是,Foggy插件支持IE的后备(仅使用不透明度),这是我需要的。
long time ago, but here is at least a hint for a simple solution: 很久以前,但这里至少是一个简单解决方案的提示:
BlurPass.prototype.render = function(target){
$('<div/>', {
html: this.content, 'class': 'foggy-pass-'+this.position
}).css({
position: this.position,
opacity: this.opacity,
top: this.offset[0],
left: this.offset[1]
}).appendTo(target).fadeIn('slow');
};
just add .fadeIn('slow'); 只需添加.fadeIn('慢'); to the append-func
到append-func
see also: jQuery using append with effects 另见: jQuery使用append with effects
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.