Question

我想做一些像here这样的事情，所以我使用了以下jsfidlle（效果很好）来创建我自己的http://jsfiddle.net/a2q7zk0m/1/，但是包含了自定义菜单。现在它不起作用，我想这可能是因为javascript中的错误：

$(document).ready(function() {
    $(window).scroll(function(e) {
        $el = document.getElementById('temp');
        if ($(this).scrollTop() > 100) {
            $el.addClass("fixedNav");
        } else {
            $el.removeClass("fixedNav");
        }
    });
});

不识别div的ID并从css请求类，但遗憾的是我不能在这里使用class属性。你能帮我解决这个问题吗？谢谢！

Answer 1

替换此行：

$el = document.getElementById('temp');

用这个：

$el = $('#temp');

JSFiddle

或者将$el包装到jQuery对象中：

$el = document.getElementById('temp');
// ...
$($el).removeClass("fixedNav");

JSFiddle

此外，您应该在$el方法之外移动$(window).scroll声明（以便在滚动时不在DOM中搜索元素）

$(document).ready(function(){
    var $el = $('#temp');
    $(window).scroll(function (e){
        if ($(this).scrollTop() >= 100 && !$el.hasClass("fixedNav")) {
            $el.addClass("fixedNav");
        }else if($(this).scrollTop() < 100 && $el.hasClass("fixedNav")){
            $el.removeClass("fixedNav");
        }
    });
});

如何在滚动时从页面中间离开菜单栏？

1 个答案: