你可以調用基於div大小的JavaScript方法嗎？

Question

我想知道是否有除jQuery之外的任何方式來運行JavaScript代碼的基礎上，如果div的大小達到一定的大小範圍？所以如果用戶拖動他們的瀏覽器窗口大約是屏幕的一半，我想在JavaScript中設置一個變量值，如果他們再次使其全屏（這使得div更大），我想要這個變量值設置回原始值。

總之，我想要根據div的大小變小或大於某個指定的斷點大小（比如200px）來切換JavaScript變量。

這可能嗎？

Answer 1

您可以使用.offsetWidth和.offsetHeight屬性。

render(); 

function render() { 
    var width = document.getElementById('yourDivID').offsetWidth; 
    if (width < 200) { 
     foo(); 
    } 
    else { 
     bar(); 
    } 
} 

window.addEventListener('resize', render);