Question

所以，我有一个newletter signupo框，它在页面的特定位置淡入淡出。注册框还有一个关闭它的按钮。单击此按钮后，我希望在重新加载页面之前不再显示它。我的假设是分配一个disablefade变量，然后停止执行滚动功能。但是，由于某种原因，这不起作用。当点击不再感谢并再次滚动时，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);
            }
        }

    });

在代码中，您已使用条件检查scroll函数外的disableFade值。另外，在使用变量时，不应每次都使用var。

Answer 2

1：使用boolean类型而不是string。从作业中删除引号。

var disableFade = true;

2：你正在做一个新的init。 .click触发器范围内的变量。删除开头的var。您想要覆盖变量，而不是创建新变量。

3：如果条件为if(!disableFade)

，则将其更改为

Answer 3

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

    $("#nl-pop").hide();
    var disableFade;

    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;
        return disableFade;
    });

    console.log(disableFade);

    if(disableFade !== true)
        {
         $(window).scroll(function() {
            if($(window).scrollTop().topOfOthDiv1) {
                    $("#nl-pop").fadeOut(200);
                }
            }

        });        
    }

});

布尔值在调用时不需要引用。

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

3 个答案: