Fixing a header after scrolling to a certain point

Fixing a header after scrolling to a certain point

For this we have to use javascript for fixing header at a certain point.

$(document).scroll(function() {
 var y = $(document).scrollTop();
 header = $("#menu");
 if (y >= 200) {
 header.css({
 position: "fixed",
 "top": "0",
 "left": "0"
 });
 } else {
 header.css("position", "relative");
 }
});

So here #menu is the id of the header that i want to fix .

JS fiddle link – My Code

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Create a free website or blog at WordPress.com.

Up ↑

%d bloggers like this: