弹出显示页面加载,然后在我一定时间后消失

时间:2015-09-04 01:14:03

标签: javascript jquery html css

我有以下弹出窗口,我想知道是否有任何方法可以让这个弹出窗口显示在页面加载?然后,无论如何,我可以让它自己关闭,而不必在一段时间后过期而点击它?

<div class="dashboard_welcome_help">
    <a class="admin_popup" href="javascript:void(0)">Click Here</a>
    <div class="admin_help_popup light_admin">
        <a class="close_admin_popup" href="javascript:void(0)">Close</a>
        <div id="indexpopupTitleWrap">
            <div id="indexpopupTitle">Have Questions?</div>
        </div>
        <div id="contactMessageStatus"></div>
    </div>
        <div class="white_overlay"></div>
</div>

JQuery的

$('.admin_popup').on('click',function(){
        $(".light_admin,.white_overlay").fadeIn("slow");
    });

    $('.close_admin_popup').on('click',function(){
        $(".light_admin,.white_overlay").fadeOut("slow");
     });

3 个答案:

答案 0 :(得分:1)

您可以像这样使用setTimeout函数:

setTimeout(function(){
    $(".light_admin,.white_overlay").fadeOut("slow");
}, 2000);

第一个参数是要执行的函数,第二个参数是执行前要等待的毫秒数。

答案 1 :(得分:1)

使用jQuery的delay函数,如此

$(".myPopup").delay( 5000 ).fadeIn("slow");

delay函数在执行delay调用之后的操作之前需要一个毫秒的值

答案 2 :(得分:1)

您使用javascript setTimeout

    function getParameterByName(name) {
        name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
        var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
            results = regex.exec(location.search);
        return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
    }

    $(document).ready(function () {

        var index = getParameterByName("queryString"); // example your url : http://xxx.aspx?queryString=Index


        // Check
        if (index == "Index") {
            // On Load Show
            $(".light_admin,.white_overlay").fadeIn("slow");

            // Set time Out 5 second
            setTimeout(function () { $(".light_admin,.white_overlay").fadeOut("slow"); }, 5000);
        }

        $('.admin_popup').on('click', function () {
            $(".light_admin,.white_overlay").fadeIn("slow");
        });

        $('.close_admin_popup').on('click', function () {
            $(".light_admin,.white_overlay").fadeOut("slow");
        });

    });