jQuery 使用jQuery在5秒内显示一个div

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12721029/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 11:57:20  来源:igfitidea点击:

Use jQuery to show a div in 5 seconds

jquery

提问by nasty

I want to fade in a div on my website in 5 seconds. Also, I dont want to use css Display:noneto hide the div, because this div is very important and I'm thinking if the user doesnt have JS enabled, the div will be hidden forever. So can you guys please tell me how to hide the div on website load and make it visible in 5 seconds? Thanks heaps.

我想在 5 秒内淡入我网站上的 div。另外,我不想使用 cssDisplay:none来隐藏 div,因为这个 div 非常重要,我在想如果用户没有启用 JS,div 将永远隐藏。那么你们能告诉我如何在网站加载时隐藏 div 并使其在 5 秒内可见吗?谢谢堆。

<div id="lead_form"></div>

回答by Ivan Ivkovi?

setTimeout(function(){
   $('#lead_form').show();// or fade, css display however you'd like.
}, 5000);

回答by MatRt

If you want to make a unobstrusive feature, you should let the div visible by default.

如果你想制作一个不引人注目的功能,你应该让 div 默认可见。

When the page is correctly loaded, the first task to do is to hide the DIV with jQuery, and then, run an animation to show it in 5s.

当页面正确加载后,首先要做的就是用jQuery隐藏DIV,然后运行一个动画在5s内显示出来。

By doing this way, if there is no JS activated, the DIV is already available.

这样做,如果没有JS激活,DIV就已经可用了。

$(document).ready(function() {

    // Hide the div
    $("#lead_form").hide();

    // Show the div in 5s
    $("#lead_form").delay(5000).fadeIn(500);

});

回答by Dimuthu

Use noscript tag and put div in it to display when java script is disabled in browser.

使用 noscript 标签并在其中放置 div 以在浏览器中禁用 java 脚本时显示。

<noscript>
    <div id="lead_form"></div>
</noscript>

Use below code to fade in with in five seconds for java script enabled browsers

使用以下代码在 5 秒内淡入启用 Java 脚本的浏览器

$("#lead_form").fadeIn(5000);

回答by user007

The below code worked for me, if you are intending to show the Div for a few seconds...

下面的代码对我有用,如果你打算显示 Div 几秒钟......

$('#divInfo').fadeIn("fast", function(){        
        $("#divInfo").fadeOut(4000);
    });

回答by StaticVariable

Try this

尝试这个

 $('#lead_form').hide("fast",function(){
    $("#lead_form").show(5000);
    });

回答by Bill Hayden

As you don't want to hide the div forever if JS is disabled, you'd want to hide it on doc ready and then show it again in 5 seconds. Here's a fiddlethat demonstrates the behavior. However, if the div is important enough to be shown all the time with JS off, then I'm not sure if you'd really want to hide it and then show it in the first place.

因为如果 JS 被禁用,你不想永远隐藏 div,你想在文档准备好时隐藏它,然后在 5 秒内再次显示它。这是一个演示行为的小提琴。但是,如果 div 足够重要,可以在关闭 JS 的情况下一直显示,那么我不确定您是否真的想隐藏它,然后首先显示它。

回答by fatima n

first you should hide $('#load_form')before appending to page : $('#load_form').hide()then you should show it with this function .fadeIn( [duration] [, callback] )you must set duration5000.

首先你应该$('#load_form')在追加到页面之前隐藏:$('#load_form').hide()然后你应该用这个函数显示它.fadeIn( [duration] [, callback] )你必须设置duration5000。