Question

我有一个客户网站 - www.stagecraft.co.uk，他们希望当您向下滚动页面时hire pages（longer page）上的导航仍然存在。我有一个快速前进（不是现场），位置固定，但这样做左侧导航从窗口顶部约200px左右。什么时候在滚动时把它放在窗口顶部？

提前致谢....

Answer 1

只有当滚动到达某一点时，才能使其位置固定：

$(window).scroll(function() {
    if ($(this).scrollTop() > 200) { //I just used 200 for testing
        $("#tester").css({ "position": "fixed", "top": 0 });
    } else {
        $("#tester").css({ "position": "absolute", "top": "200px" }); //same here
    }               
});

并且div的CSS如下：

#tester {
    position: absolute;
    right: 20px;
    top: 200px;
    height: 200px;
    width: 100px;
    background: red;
}

Answer 2

$（window）.scroll（function（）{ $（'＃myElement'）。css（'top'，$（this）.scrollTop（）+“px”）; }）;

我从问题257250得到了这个

What is the simplest jQuery way to have a 'position:fixed' (always at top) div?

Answer 3

我会犹豫只使用jquery - 我认为滚动页面时真的很烦人，而且由于javascript更新元素的位置，DIV“跳”。

我使用position：fixed，然后在最初向下滚动时使用javascript将框的位置移动到左侧顶部，然后将其保留在那里。这是一种妥协。

通过滚动页面保持侧面导航固定

3 个答案: