当前位置:  开发笔记 > 前端 > 正文

如何使用jQuery淡出div?

如何解决《如何使用jQuery淡出div?》经验,为你挑选了4个好方法。

有没有办法在不使用setTimeOut函数的情况下在5秒后淡出div?



1> ExodusNichol..:

大家都知道在jquery 1.4中现在有延迟功能,对吗?

$('#div').delay(5000).fadeOut(400)

这就是你如何做到这一点,而无需添加任何自定义函数或插件.它是jquery 1.4的原生



2> Ionuț Staicu..:

情况1:如果你想在5秒后启动 fadeOut,请使用:

jQuery.fn.delay = function(time,func){
    return this.each(function(){
        setTimeout(func,time);
    });
};

然后,像这样使用它:

$('#div').delay(5000, function(){$(#div').fadeOut()})

如果不使用setTimeOut,则无法实现此目的

情况2:如果您希望fadeOut 的持续时间为5秒,请使用:

$('#div').fadeOut(5000)



3> ckramer..:

fadeOut()函数怎么样?看起来像这样:

$("#myDiv").fadeOut(5000);


这并没有真正回答这个问题.他希望在*5秒之后褪色*,在*5秒内没有淡出*.

4> Juri..:

我只是遇到了同样的问题,在我看来,明确的答案实际上并不能真正满足这个问题.如果有人指定它

$("#myDiv").fadeOut(5000);

根据建议,褪色过程本身将持续5秒,但不会在5秒后开始.

所以我正在寻找替代方案,而不必包含另一个jQuery插件等.我想出的最简单的解决方案是按如下方式编写:

$("#myDiv").fadeTo(5000,1).fadeOut(1000);

它使用了fadeTo效果,它在某种程度上是一种"黑客".我让fadeTo运行5秒钟,让它淡入1 = 100%不透明度.以这种方式,用户不会察觉到任何变化.然后正常调用fadeOut,持续时间为1秒.

我想这个解决方案很简单,因为它不需要任何额外的插件,可以用1行编写.

干杯.

//编辑:
显然现在有可能做这样的事情:

$('#myDiv').delay(800).fadeOut(1000);

这里有一些更酷,更实用的功能.

推荐阅读
地之南_816
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有