javascript - 切换页面高度的显示条件

Question

所以我有这个完美运行的切换显示代码:

function toggle_visibility(id) {
    var x = document.getElementById(id);
    if (x.style.display == 'block')
        x.style.display = 'none';
    else
        x.style.display = 'block';
}

我使用此切换显示作为粘性导航上搜索框的下拉菜单。我的粘性导航偏移 300 像素，当页面超出该切换保持显示状态时，我如何 - x.style.display = 'none'; - 根据到页面高度？

到目前为止，我的这个似乎不起作用。

function toggle_visibility(id) {
    var x = document.getElementById(id);
    if ((window.pageYOffset || document.documentElement.scrollTop <= 300) && (x.style.display == 'block'))
        x.style.display = 'none';
    else
        x.style.display = 'block';
}

Answer 1

我认为您的条件有问题:

(window.pageYOffset || document.documentElement.scrollTop <= 300)

Javascript 正在尝试评估逻辑 OR 的每一侧，并且仅测试右侧位 <=300 。换句话说，它当前正在评估:

(window.pageYOffset) OR (document.documentElement.scrollTop <= 300)

我认为你想要更多类似这样的东西:

(window.pageYOffset <=300 || document.documentElement.scrollTop <= 300)

如果我能用 fiddle 确认它，我会更有信心，但我希望它能有所帮助。