保持侧面导航通过滚动页面固定 [英] Keep Side Navigation Fixed with Scrolling of page

问题描述

我有一个客户网站 - www.stagecraft.co.uk，他们想要导航租用页面（长篇网页）仍然在那里当您向下滚动页面。我有一个快速去（不是生活）与位置固定，但这样做左侧导航大约200px左右从窗口的顶部。

I have a clients website - www.stagecraft.co.uk and they want the navigation on the hire pages (longer page) to still be there at when you scroll the page down. I've had a quick go (not live) with position fixed but in doing so it the leftside navigation is about 200px or so from the top of the window. Any when to get it at the top of the window when scrolling?

提前感谢....

推荐答案

您可以将其位置固定，只有当滚动到达某一点：

You could make it position fixed, only when scrolling has reached a certain point:

$(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如下：

and the CSS for the div is as following:

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

这篇关于保持侧面导航通过滚动页面固定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！