判断元素与屏幕关系

[bravf]

// 判断一个元素是否在屏幕中
var isInScreen = function ($el, offset){
    var isIn = false

    if (!$el){
        return isIn
    }

    var {top, bottom} = $el.getBoundingClientRect()

    var screenHeight = window.innerHeight
    var screenStart = 0 - offset
    var screenEnd = screenHeight + offset

    if (top < screenStart){
        if (bottom > screenStart){
            isIn = true
        }
    }
    else {
        if (top < screenEnd){
            isIn = true
        }
    }

    return isIn
}
// 判断一个元素是否在屏幕中，并且内容超过半屏
var isHalfScreen = function ($el) {
    var isHalf = false

    if (!$el){
        return isHalf
    }

    var screenHeight = window.innerHeight
    var halfScreenHeight = screenHeight / 2
    var {top, bottom} = $el.getBoundingClientRect()

    if (top < 0){
        if (bottom > halfScreenHeight){
            isHalf = true
        }
    }
    else {
        if ( (top < halfScreenHeight) && (bottom - top > halfScreenHeight) ){
            isHalf = true
        }
    }

    return isHalf
}