添加额外的top .offset（）

Question

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

枫木

我认为它可以做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顶部额外增加70像素，就可以完全看到它。

我也看过使用它。

.offset({ top: 70 });

我想我用错了，因为这搞砸了。

Answer 1

事实证明，我可以将另一个类修改为子div来达到我想要的效果。 因此，我刚刚在if语句中添加了一个额外的“ addClass”，它似乎已经解决了问题。

这是我现在拥有的脚本；

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');
    }
});

我已经在'maptop'中添加了正在工作的if语句。 我不知道这是否是最好的方法，但它正在起作用，我对此表示满意