首先向下滚动显示弹出弹出第二次向下滚动不应使用jQuery显示弹出窗口

Question

我在向下滚动时试图显示弹出窗口。某些点弹出窗口将显示正常的代码。

<div id="spopup" style="display: none;" class="news_sletter">
                            <a style="position: absolute; top: 7px; right: 10px; color: #555; font-size: 10px; font-weight: bold;" href="javascript:void(0);" onclick="return closeSPopup();">
                                <img src="images/ico-x.png" width="18" height="18" style="background: #fff;" />
                            </a>
                            <div class="side_bar_sub_heading">
                                <h6>Newsletter </h6>
                            </div>
                            <p>Subscribe to our email newsletter for useful tips and resources.</p>
                            <form>
                                <div class="form-group blog_form">
                                    <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email Address">
                                </div>
                                <div class="search_btn-3">
                                    <button class="btn btn-default" type="submit">Subscribe </button>
                                </div>
                            </form>
                        </div>

jQuery代码在

下方

<script>
 var isAlreadyPopUp = true;
$(window).scroll(function () {
    if(!isAlreadyPopUp){
            if ($(document).scrollTop() >= $(document).height() / 25)
        $("#spopup").show("slow"); else $("#spopup").hide("slow");
     }
});
function closeSPopup() {
    $('#spopup').hide('slow');
}
</script>

和CSS是

<style type="text/css">
    /* popup css*/
    #spopup {
        background: hsl(0, 0%, 0%) none repeat scroll 0 0;
        border-radius: 9px;
        -moz-border-radius: 9px;
        -webkit-border-radius: 9px;
        -moz-box-shadow: inset 0 0 3px #333;
        -webkit-box-shadow: inset 0 0 3px #333;
        box-shadow: inner 0 0 3px #333;
        padding: 27px;
        width: 300px;
        position: fixed;
        left: 40%;
        display: none;
        z-index: 10;
        margin-bottom: 40px;
        text-align: center;
    }
</style>

我的要求是一旦用户不想订阅，他将单击关闭按钮弹出窗口将成功关闭，稍后又五到十分钟后，我们想自动显示弹出窗口。

请帮助我。

Answer 1

您可以创建一个全局变量。

var isAlreadyPopUp;

您可以根据需要将值设置为" true"或" false"。在这种情况下，在关闭或已经滚动等等时。

。

isAlreadyPopUp=true;

之后，您始终可以检查 isalReadyPopup value，如果是正确的话，则无需执行弹出式显示代码。

$(window).scroll(function () {
        if(!isAlreadyPopUp){
                if ($(document).scrollTop() >= $(document).height() / 25)
            $("#spopup").show("slow"); else $("#spopup").hide("slow");
         }
    });
    function closeSPopup() {
        $('#spopup').hide('slow');
 }

编辑： -

您可以使用Settimeout功能在时间间隔内打开弹出窗口。

setTimeout(function(){ alert("Hello"); }, 3000);