jQuery 'Stay Put'

6th March 2009

Stay Put !

Keep it in view!

Important information, and links, can be kept on screen whilst scrolling.

Buy now!

Buy Now!

while it's HOT

ONLY $20,000!

Copyright © stu nicholls

Next Demonstration

Previous Demonstration


This one is a little different. The above banner is in the general flow of the page and will scroll as normal when using the scrollbars or the mousewheel. However, as soon as it reaches the top of the screen, it pops out of its position in the page and stays 'fixed' at the top of the screen while the page scrolls beneath.

When scrolling back to the top of the page this banner will stay at the top until it reaches its original position where it will drop back into the page and scroll normally.

In this way you can keep important information on screen.

Tested in IE6, IE7, Firefox, Opera, Safari (PC) and Google Chrome.

IE6 has to use a different method to all other browsers and visitors using this browser will notice slight jumping of the banner when fixed at the top of the screen. All modern browsers will see a rock solid banner in its fixed position.

You will need a copy of jQuery to be able to use this demonstration.

If you would like a copy of this demo then please email me and make a donation to support stunicholls.com, every little helps to keep this site up and running.