Keď sa webová stránka posunie nadol, po záhlaviach sa nastaví na vrchol, posúva sa posuvník - javascript, jquery, html, css3

V podstate čo sa snažím urobiť, je mať na začiatku pevnú hlavičku, keď sa roluje. nájdete nižšie uvedený kód, ktorý som použil.

//This method is used to fixed header, while page is scrolling.
var fixedPageHeader = {
fWScrolling : function () {
var div = $("#headinfor");
var start = $(div).offset().top;

$.event.add(window, "scroll", function(){
var p = $(window).scrollTop();
if((p)>start){
$(div).css("position","fixed");
$(div).css("top", "0px");
$(div).css("left","0px");
$(div).css("margin-top","-2px");
$(div).css("z-index","500");
}else{
$(div).css("position","static");
$(div).css("top","");
$(div).css("margin-top","0px");
$(div).css("z-index","0");
}
});
}
}

v čase, keď sa záhlavie fixuje v hornej časti stránky, posunutím posúvača doprava sa spustí. Nebudem môcť posúvať nadol na stránku.

odpovede:

Dôvodom tohto problému je, keď je záhlavie opravenév hornej časti prehliadača bude jej z-indexu pridelená hodnota. Takže medzi obsahom a horným pruhom prehliadača, ktorý je x, sa vytvorí priestor (pozrite si obrázok, ktorý som pripojil). Posuvník sa rýchlo poskakuje.

https://drive.google.com/file/d/0B1dp9jlk2GZMYU9iM3lST2xzSkk/view?usp=sharing

Aby ste sa dostali na cestu, musíte vytvoriť div s rovnakou výškou ako záhlavie. keď sa pri posúvaní nadol a pri skrolligingu skrýva na vrchu prehliadača.