mapstick

Question

我想知道如何在这个div中添加额外的“top”.offset（）;

mapstick

我认为它的事情要做startPosition？我以为我可以在CSS中改变它，但这只是破坏了div在某个高度上的功能。

我在CSS中尝试在div上创建顶级px'！important'。这就是打破了if / else语句的原因，因为它搞砸了div的实际顶部和脚本没有意识到它的样子。

var navWrap = $('#navWrap'),
    nav = $('#mapstick'),
    startPosition = navWrap.offset().top,
    stopPosition = $('#stopHere').offset().top - nav.outerHeight();

$(document).scroll(function () {
    //stick nav to top of page
    var y = $(this).scrollTop()

    if (y > startPosition) {
        nav.addClass('sticky');
        if (y > stopPosition) {
            nav.css('top', stopPosition - y);
        } else {
            nav.css('top', 0);
        }
    } else {
        nav.removeClass('sticky');
    }
});

我只需要在div的顶部额外增加70px，这样就可以完全看清了。

我也考虑过使用它;

.offset({ top: 70 });

我认为我使用了这个错误，因为这只是搞砸了。

Answer 1

原来我可以将另一个类修改为一个子div，以达到我想要的效果。所以我刚刚添加了一个额外的“addClass”＃39; if语句似乎已经完成了这个技巧。

这是我现在的脚本;

var navWrap = $('#navWrap'),
    nav = $('#mapstick'),
    maptop = $('#map')
    startPosition = navWrap.offset().top  ,
    stopPosition = $('#stopHere').offset().top   - nav.outerHeight();

$(document).scroll(function () {
    //stick nav to top of page
    var y = $(this).scrollTop()

    if (y > startPosition) {
        nav.addClass('sticky'),
        maptop.addClass('maptop');
        if (y > stopPosition) {
            nav.css('top', stopPosition - y);
        } else {
            nav.css('top', 0);
        }
    } else {
        nav.removeClass('sticky'),
        maptop.addClass('maptop');
    }
});

我添加了＆＃39; maptop＆＃39;到if语句正在工作。我不知道这是否是最好的方法，但它正在工作，我很好用那个哈哈

添加额外的顶部.offset（）

mapstick

1 个答案: