Link to home
Start Free TrialLog in
Avatar of Rowby Goren
Rowby GorenFlag for United States of America

asked on

Floating menu stays on top of a web page when scrolling up and down

Hello

I have a client who wants there to be a horizontal menu that stays at the top of the page when a visitor scrolls up and down.

They want the menu to stay visible at the top at all times.

I think something like this is basic css.  Or am I missing something.  Would javascript be a part of the mix?

Thanks!

Rowby
ASKER CERTIFIED SOLUTION
Avatar of leakim971
leakim971
Flag of Guadeloupe image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Sticking to the top is easy. Just css. For the menu bar, just use position:fixed;top:0;left:0; and z-index it on top of everything. Sticking to the bottom is more difficult to achieve.
Fix it with CSS
Add this to your header:

   position: fixed;  
    width: 100%;  
    left: 0;  
    top: 0;  
    z-index: 100;
Avatar of Rowby Goren

ASKER

Thanks,  tru3533!

I'll be doing it tomorrow.

Rowby
Hello

Sorry for the delay on this. I hope to get this implemented early next week,

Rowby
OOpos.  Sorry I did not award the points.  Thanks please award the points.  I am using Leakim971's solution.

Rowby