jquery里判断元素是否在可视区域的方法及在线实例演示亲测


  • :
  • 04-17 13:03
  • :
  • 314次
  • :
  • 0条
  • 5赞

简介jquery里决断一个指定的元素,如div,img等HTML元素是否处在浏览器的可视区域之内的具体方法和在线实例演示。

在jquery里,我们如果要判断一个HTML元素,如div,img等是否处在可视区域内是非常简单的,需要用到jquery里内置的几个函数:

offset:获取元素的位置,如:$("#div").offset().top; 或 $("#div").offset().left;

scrollTop:获取匹配元素相对滚动条顶部的偏移

看下面站长准备的一个在线实例演示:

jquery里判断div是否在可视范围之内的在线演示


具体的代码如下:

function CheckIFView(id){	
    var t=$("#"+id).offset().top;    
    if (t >= $(window).scrollTop() && t < ($(window).scrollTop()+$(window).height())) {    	
        return true;    
    }else{    	
        return false;    
    }
}


上面的函数我们还可以稍微的改写一下,比如判断元素离页面的可视范围相差具体多少元素的高度:

function CheckIFView(id){
    var mh=100;//距离可视范围的高度	
    var t=$("#"+id).offset().top-mh;    
    if (t >= $(window).scrollTop() && t < ($(window).scrollTop()+$(window).height())) {    	
        return true;    
    }else{    	
        return false;    
    }
}


您正在找的文章可能是: