艾Q网

标题: jquery监听页面滚动，获取元素距离屏幕顶部高度 [打印本页]

作者: admin 时间: 2024-3-10 14:29
标题: jquery监听页面滚动，获取元素距离屏幕顶部高度
监听页面滚动函数

$(window).scroll(function(){
//这里执行你要的函数
});

JavaScript
获取元素距顶部距离的高度

var w_t = $(window).scrollTop(); //滚动条高度
var tag_t = $('#tag').offset().top; //id 为tag 距离页面顶部高度
var tag_h = tag_t -tag_t ; //元素距离电脑屏幕顶部高度

例子：

当id为#lead元素距离电脑屏幕顶部高度小于0时，固定浮动到指定位置，当大于或等于原来高度时恢复到原来位置

$(window).scroll(function(){
var lead_t = ($('#lead').offset().top - $(window).scrollTop()); //当前高度
//距离电脑屏幕顶部高度小于0时
if(lead_t <= 0){
$('#lead').css({
'position':'fixed',
'top':'45px',
});
}
//大于或等于原来高度
if(lead_t == $('#lead').offset().top){
$('#lead').css({
'position':'static',
});
}

});

欢迎光临艾Q网 (http://js.iqi123.com/bbs/)