獲取元素(這(zhè)裏定位元素A)距離頂部的(de)高(gāo)度,接著(zhe)設定scroll滾動的(de)事件,比如超過那個(gè)高(gāo)度,把A的(de)位置設定爲fixed,小于該高(gāo)度,修改回relative。
方法一:
$(function() {
var elm = $('.nav');
var startPos = $(elm).offset().top;
$.event.add(window, "scroll", function() {
var p = $(window).scrollTop();
$(elm).css('position',((p) > startPos) ? 'fixed' : 'static');
$(elm).css('top',((p) > startPos) ? '0px' : '');
});
});
方法二:
$(function(){
//獲取要定位元素距離浏覽器頂部的(de)距離
var navH = $(".nav").offset().top;
//滾動條事件
$(window).scroll(function(){
//獲取滾動條的(de)滑動距離
var scroH = $(this).scrollTop();
//滾動條的(de)滑動距離大(dà)于等于定位元素距離浏覽器頂部的(de)距離,就固定,反之就不固定
if(scroH>=navH){
$(".nav").css({"position":"fixed","top":0});
}else if(scroH<>
$(".nav").css({"position":"static"});
}
})
})