css3 - CSS Position Fixing -


i have managed use position:fixed setting of css/css3 before , worked quite well!

i saw few days ago , wondering how did achieve effect happens when scroll down, menu bar in 1 position before scroll , goes top locks down.

see link - http://www.cssportal.com/ < scroll down on page , observe top blue menu.

i have tried in source of page cant make head or tails.

does know effect called?

it's done javascript, add css class contains position:fixed , other positioning styles achieve want.

it's not complicated. here jquery plugin: http://stickyjs.com/

this how did few years ago:

var menu_bar = $("#menu"); var top = menu_bar.offset().top; var detached = false;  $(window).scroll(function (e) {     if ($(this).scrolltop() >= top) {         if (!detached) {             detached = true;             menu_bar.addclass('fixed');         }     } else {         if (detached) {             detached = false;             menu_bar.removeclass('fixed');         }     } }); 

Comments