如何判斷元素在視口中是否可見並佔用整個視口？

Question

我在這裏找到了這個解決方案：https://stackoverflow.com/a/7557433/5628

但是，這僅用於確定元素是否在視口內可見。

改爲：我試圖做的事情略有不同，因爲我想確定元素是否佔用整個視口。

Answer 1

您需要調整代碼位，但這種完美地使用jQuery的一小部分：

$(window).resize(function() { 
    myFun.elementBiggerThanViewportCallback(); 
}); 

myFun.elementBiggerThanViewport = function (el) { 

    //special bonus for those using jQuery 
    if (el instanceof jQuery) { 
     el = el[0]; 
    } 

    var rect = el.getBoundingClientRect(); 

    return (
     rect.top <= 0 && 
     rect.bottom >= (window.innerHeight || document.documentElement.clientHeight) 
    ); 
} 

elementBiggerThanViewportCallback = function (el) { 
    var ifBigger = tabccordion.elementBiggerThanViewport(el); 
    // Do stuff here. 
} 

Answer 2

檢查，如果元件的頂部和左側是小於或等於當前的滾動或視位置，並且如果元件的高度和寬度等於或大於視口然後