jQuery淡出DIV显示一定时间后

时间:2013-02-27 17:49:10

标签: jquery

我有以下代码,并希望在页面加载后的指定时间后隐藏DIV(.video-field-new),例如5秒。这可能吗?

<div id="BodyField">
    <div class="video-field-new"></div>
</div>

如果我可以让它淡出而不是仅仅因为用户会看到这种情况而消失而获得奖励。

5 个答案:

答案 0 :(得分:39)

你可以这样做

$("#BodyField").delay(5000).fadeOut();

答案 1 :(得分:19)

$(window).load(function(){
  setTimeout(function(){ $('.video-field-new').fadeOut() }, 5000);
});

答案 2 :(得分:1)

尝试

$('#div').fadeIn('fast').delay(1000).fadeOut('fast');
$('#div-inner').fadeIn('slow').delay(1000).hide(0);

由于

答案 3 :(得分:0)

即使我们可以这样做: 在HTML中

    <div id="BodyField">
        <div class="video-field-new">
      <p>This is your DIV with text which will fade Out after delay 5s using jQuery</p>
      <p>This is your DIV with text which will fade Out after delay 5s using jQuery</p>
      <p>This is your DIV with text which will fade Out after delay 5s using jQuery</p>
      <p>This is your DIV with text which will fade Out after delay 5s using jQuery</p>

    </div>
</div>

在js:

$(function() {
    $('.video-field-new').delay(5000).show().fadeOut('slow');
});

在css中:

div { 
    width:200px; 
    height:80px; 
    float:left; }

演示点击链接 https://jsfiddle.net/kingtaherkings/133v70se/

答案 4 :(得分:0)

你也可以这样做

/tmp/some/random/directory $ fd

/home/fuchsia $

$(document).ready(function(){ $('.video-field-new').fadeOut(5000) })

参数 | 说明


速度 = 可选。指定淡入淡出效果的速度。默认值 是 400 毫秒

可能的值:

  • 毫秒
  • “慢”
  • “快”

缓动 = 可选。指定元素在不同点的速度 动画。默认值为“摆动”

可能的值:

  • "swing" - 在开始/结束时移动较慢,但在中间移动速度较快
  • “线性” - 以恒定速度移动

回调 = 可选。要在fadeOut() 之后执行的函数 方法完成


有关详细信息,请查看此文档 https://www.w3schools.com/jquery/eff_fadeout.asp