问题
If you go to an article on The Economist website. For example:
http://www.economist.com/node/17629757
When you scroll down the page past a certain point (either with the PAGEDOWN button or by incrementally scrolling with the DOWNARROW key), a red sticky header appears.
Is that jQuery?
How is that implemented?
回答1:
The content, while added via JavaScript is just position: fixed.
回答2:
The Economist uses Apture, a service which includes the sticky header and a few other features on the page. (The header has the ID "aptureD", so I started Googling.) If all you want is that exact header, you can just use their service.
回答3:
You can use the Apture or make a custom sticky header. Look at example.
回答4:
There are two ways to achieve that: position:fixed and position:absolute.
The first one is very basic and you won't be able to get any sliding animation. The second one is what used in your example. Here is a good tutorial with demo and a source.
来源：https://stackoverflow.com/questions/4360816/how-does-economist-com-implement-their-sticky-header-jquery