當div滾動到頂部時,DIV固定在頂部不動,不隨滾動條滾動而滾動,除這個div以外的其它元素可以滾動

JS:

當div滾動到頂部時,DIV固定在頂部不動,不隨滾動條滾動而滾動,除這個div以外的其它元素可以滾動

function scrollDiv  () {
var ie6 = document.all; 
var dv = $('#fixedMenu_keleyi_com'), st; 
dv.attr('otop', dv.offset().top); //存儲原來的距離頂部的距離 
$(window).scroll(function () { 
st = Math.max(document.body.scrollTop || document.documentElement.scrollTop); 
if (st > parseInt(dv.attr('otop'))) { 
if (ie6) {//IE6不支持fixed屬性,所以只能靠設置position爲absolute和top實現此效果 
dv.css({ position: 'absolute', top: st }); 
} 
else if (dv.css('position') != 'fixed') dv.css({ 'position': 'fixed', top: 0 }); 
} else if (dv.css('position') != 'static') dv.css({ 'position': 'static' }); 
}); 
}

html代碼    用到了css的z-index:這個屬性,此處將固定的部分顯示層在最上層,非固定部分當滾動時顯示在固定部分的底層 

z-index:的值越大爲固定在頂層

<div style='width:100%;  text-align: center;background:#ffffff;z-index:99999;padding:30px 0px 0px 0px;' id="fixedMenu_keleyi_com">
		<div style='width:100%; margin-top:0px; margin-bottom:10px; text-align: center;background:#ffffff;z-index:99;' >
		  	   							此外爲你要固定的內容
		  	   						</div>
		  	   						 </div>

<div class="coe_team_gover coe_main_content" style='width: 100%;z-index:-99999;'>此處爲非固定內容</div>



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章