判断是否在指定的可视区域内,先用最简单的方式,比如整个页面为可视区域
找到几个关键因素:
sTop= $(window).scrollTop(); //滚动条距顶部的高度
clientHeight= document.documentElement.clientHeight; //可视区域的高度
pos = = $("#pointinfo_" + markers[i].id).offset().top; //指定的元素上方距顶部的高度
pos1 = $("#pointinfo_" + markers[i].id).height()+pos; //指定的元素下方距顶部的高度
所以就可以根据这个公式判断是否在可视区域内了
if ((sTop+clientHeight >= pos && sTop+clientHeight <= pos1) || (sTop >= pos && sTop <= pos1)) {
//符合条件的进入里面
}
//如果在页面指定特定的区域为可视区域,还需在调整一下,比如,页面的上方有一定的固定区域,我们可以这么来判断:
比如上方区域的高度为headerHeight
var seTop=sTop+clientHeight-headerHeight;
var shTop=sTop+headerHeight;
所以引用公式就是:
if ((seTop >= pos && seTop <= pos1) || (shTop >= pos && shTop <= pos1)) {
//符合条件的进入里面
}
比较靠谱的方法:
var sTop = $(window).scrollTop(); //滚动条距离顶端的高度
var se = document.documentElement.clientHeight; //浏览器的高度
var headerHeight = $("#header").height() + 10; //页面表头的高度
var seTop = sTop + se - headerHeight;
var shTop = sTop + headerHeight;
var pos_current = $("#").offset().top;
var pos1_current = $("#").height() + pos_current;
if ((shTop > pos1_current) || seTop < pos_current) {
//超出可是范围了
}
else
{
//在可视范围内
}