CODEWITHSUNDEEP
javascripthtmlcss
Chief
Chief

Reputation: 23

Always-on-top header

I want to add a always-on-top header like the new twitter does. Explanation: When the user scrolls down the page, I want the header to stay on top of the window.

Somebody know a script that does that? Or can target me how can I do it?

Upvotes: 2

Views: 4606

Answers (3)

Vlad.P
Vlad.P

Reputation: 1464

You can use position: fixed; on the header.

<div id="header">
content goes here.
</div>

and the CSS:

#header { position: fixed; z-index: 9999; top: 0; left: 0; }

Upvotes: 5

Jakob
Jakob

Reputation: 24370

Use position:fixed on the header in its CSS.

Also, dont forget to set the left and top attributes to where you want it to go :)

Upvotes: 0

Sarfraz
Sarfraz

Reputation: 382909

You need to give your header a position of fixed to make it visible throughout the page. And set the top value appropriately along with width.

Example:

#header{
  position:'fixed';
  top:0;
  width:800px;
}

Upvotes: 1

Related Questions