javascript - 单击链接时如何禁用淡入/淡出 div

Question

所以，我有一个新信注册框，它在页面的特定位置淡入和淡出。注册框还有一个按钮可以将其关闭。单击此按钮后，我希望它在重新加载页面之前不再显示。我的假设是分配一个 disablefade 变量，然后停止要执行的滚动功能。但是，由于某种原因，这不起作用。当点击 no thanks 并再次滚动时，div 将再次显示...

感谢您的帮助!

jQuery(document).ready(function($) {

    $("#nl-pop").hide(); //hide nl block initially
    var disableFade = "false";

    var topOfOthDiv1 = $("#newsletter-cta").offset().top - 1500;
    var topOfOthDiv3 = $("#newsletter-cta").offset().top;

    jQuery('#no-thanks').click(function(event) {
        event.preventDefault();
        jQuery('#nl-pop').fadeOut('slow');
        var disableFade = "true";
    });

    console.log(disableFade);

    if(disableFade === "false")
        {
         $(window).scroll(function() {
            if($(window).scrollTop()  topOfOthDiv1) { //scrolled past the other div?
                    $("#nl-pop").fadeOut(200); //reached the desired point -- show div
                }
            }

        });        
    }

});

Answer 1

应在滚动函数内检查禁用淡入淡出变量值，如下所示。

$(window).scroll(function() {
        //here you check whether disableFade==="false"
        if($(window).scrollTop().topOfOthDiv1 && disableFade==="false") {
                $("#nl-pop").fadeOut(200);
            }
        }

    });

在代码中，您已使用条件检查滚动函数外部的 disableFade 值。 此外，当您使用变量时，您不应该每次都使用 var。