CODEWITHSUNDEEP
javascriptjquerycsshtml
Kurt
Kurt

Reputation: 61

How do I make a DIV stay at the top of the screen no matter ow far down the page my visitor scrolls?

What I'm saying is, I have some extremely long pages on my website, which can make it annoying if my visitors need to scroll to the top of the page to be able to navigate to another page.

I'm not quite sure what I would call this but any Google search that contains the words 'DIV' and 'float' come up with completely unrelated results...

What I'm looking to do is create a DIV that stays at the top of the Screen (not to be confused with the page) so that if the user is at the bottom of the page, they can still see the navigation bar just floating at the top of the screen. What I can think of is to position the DIV relative to the position of the screen but I don't know how to code this.

I'm happy to use JavaScript (preferably in the form of jQuery), but if you know how to do this using CSS, I would favour your response.

This might help: I know a little bit of jQuery and JavaScript and I know a good deal of CSS and HTML.

Thanks in advance.

Upvotes: 1

Views: 1284

Answers (3)

Ilya Shpakovsky
Ilya Shpakovsky

Reputation: 291

Try this:

<div style="position: fixed;"></div>

Upvotes: 1

SpYk3HH
SpYk3HH

Reputation: 22580

You should be able to use CSS Fixed Positioning

#eleID { 
    position: fixed;
    top: 0;
}

Upvotes: 0

Waiting for Dev...
Waiting for Dev...

Reputation: 13037

fixed position has exactly this purpose and this is pure CSS:

div {
  position: fixed;
  top: 0;
}

Upvotes: 5

Related Questions