2

我知道标题不是最具描述性的，还有更多类似问题的主题，但我找不到任何答案。事实上，多亏了你们，我才走到这一步，这就是我想要做的。

我有一个 DIV，我想在页面滚动到某个位置（触发器）时显示它，标记为#othdiv。当您向下滚动到标记为#othdiv2的下一个位置（触发器）时，此 DIV 会消失。

感觉这是一个非常简单的解决方案，但我就是想不通。我尝试过条件 if 语句、重复代码、删除行、新变量……叹息……请帮忙。

$(document).ready(function() {
$("#dvid").hide(); //hide your div initially
var topOfOthDiv = $("#othdiv").offset().top;
var topOfOthDiv2 = $("#othdiv2").offset().top;
$(window).scroll(function() {
    if($(window).scrollTop() > topOfOthDiv) { //scrolled past the other div?
        $("#dvid").show(); //reached the desired point -- show div
    }
        else
    if($(window).scrollTop() < topOfOthDiv) { //scrolled past the other div?                
        $("#dvid").hide(); //reached the desired point -- show div            
    }           
    });
});

当前代码示例：http: //jsfiddle.net/DnJ2z/124/

底线：我正在尝试做类似的事情： http: //mailchimp.com/2012/ （注意标题[应用程序、支持、操作等]）

4

2 回答 2

4

尝试使用&&as in: if (this and that){do something} else{don't}

工作示例

$(document).ready(function () {
    var topOfOthDiv = $("#othdiv").offset().top;
    var topOfOthDiv2 = $("#othdiv2").offset().top;
    $(window).scroll(function () {
        if ($(window).scrollTop() > topOfOthDiv && $(window).scrollTop() < topOfOthDiv2) {
            $("#dvid").show();
        } else {
            $("#dvid").hide();
        }
    });
});

有关逻辑运算符的更好解释，请查看：Logical Operators MDN

于 2013-05-28T00:20:09.860 回答
1

我在玩你的小提琴并设法让它工作。检查它是否是你想要的：

$(document).ready(function() {
    $("#dvid").hide(); //hide your div initially
    var topOfOthDiv = $("#othdiv").offset().top;
    var topOfOthDiv2 = $("#othdiv2").offset().top;
    $(window).scroll(function() {
        if($(window).scrollTop() > topOfOthDiv && $(window).scrollTop() < topOfOthDiv2) { //scrolled past the other div?
            $("#dvid").show(); //reached the desired point -- show div
        }
            else
        if($(window).scrollTop() < topOfOthDiv || $(window).scrollTop() > topOfOthDiv2)    { //scrolled past the other div?                
            $("#dvid").hide(); //reached the desired point -- show div            
        }           
    });
});
于 2013-05-27T23:32:09.150 回答