homepage >> jQuery hideHeaderOnScroll demo    
 

Yossef Benharosh is an apt web developer and the author of the eBook The essentials of object oriented PHP.

Yossef Benharosh web developer profile linkedin twitter github

jQuery hideHeaderOnScroll demo

The hideHeaderOnScroll jQuery plugin hides the page header when the user scrolls down the page, and shows the header when the user scrolls up the page.

* Scroll down and up the page to see the hideHeaderOnScroll plugin in action

The hideHeaderOnScroll plugin allows for part of the header to remain visible when you scroll the page down, and ofcourse you can choose to hide all of the header when you scroll down the page.

Download

You can learn how to install the plugin in the installation section, and about how to customize the plugin in the settings section.

 

About the hideHeaderOnScroll jQuery plugin

Nowadays it is very common to see fixed headers (sticky headers) at the upper most part of webpages. These kind of headers may sometimes limit the portion of the page that the users can see.

The hideHeaderOnScroll jQuery plugin solves the problem by hiding the header as the user scrolls down the page, and by causing the header to appear back again as the user scrolls up the page.

You are invited to read the documentation for this plugin at: the hideHeaderOnScroll docs where you will find additional data about ways to customize the plugin by using the built in options and callback options, and of course, you are more than welcome to download the plugin from the jQuery.hideHeaderOnScroll download page.

 

What are jQuery plugins?

jQuery is the most widely used javascript library and part of it success can be related to the thousands of plugins that it offers. Maybe the most iconic of these libraries is the jQueryUi library which is the brain child of John Resig, the person who developed jQuery.

jQuery plugins are used to give jQuery new abilities by adding new methods. When we write a new jQuery plugin we give other web developers the ability to use the plugin's methods in almost the same way that jQuery's built-in methods are used.

In order to use a jQuery plugin you need to first include the jQuery core library in the page, and then include the plugin code. Most of the plugins, have settings and callback functions that we can use in order to customize the plugin's behavior.