滚动时位置固定通过一定量的像素 [英] Position fixed when scrolled passed certain amount of pixels

问题描述

我正在寻找一种方法，只有向下滚动大约170像素之后，才能将我的网页的#header元素定位为Fixed。

I'm looking for a way to position the #header element of my page as "Fixed" only after having scrolled downward for about 170 pixels.

标题是一个横幅，所以当人们向下滚动时，我希望横幅滚动，标题在窗口顶部保持固定，页面内容在标题下滚动。

Above the header is a banner, so when people scroll down, I would like the banner to scroll away, the header to stay fixed when it hits the top of the window, and the page content to scroll underneath the header.

http://jsfiddle.net/tdskate/zEDMv/

推荐答案

这是

var header = $("#header");
$(document).scroll(function(e) {
    if($(this).scrollTop() > $("#banner").height()) {
        header.css({"position" : "fixed", "top" : "0"});
    } else {
        header.css("position", "relative");
    }
});

这篇关于滚动时位置固定通过一定量的像素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！