如何實現自適應屏幕寬高度、超出彈出滾動條
設計網頁的過程中,有時需滿足不能超出屏幕大小的規則限定,考慮到不停的屏幕有不同的SIZE尺寸。
這么一來我們就需要讓它自己獲取screen中的寬高度了。( height width )
情景:
一般網頁內容過多時,右邊出現滾動條來進行下滑查看網頁內容,當我們一個頁面中出現多個模塊,頁面規定只能顯示在
我們所看屏幕尺寸時(就是不能整體頁面滾動),當內容超出時,我們可以設置部分相關的頁面模塊進行滾動條滑動。
類似於我們在一個一面中使用到了iframe時,按需求我們只能講內容顯示在iframe中,切不超出當前的頁面大小,則
需要我們使用此方法。
使用 js 來完成這一方法:
/*使用JavaScript來實現*/ var menuHeight = document.getElementById('menu'); var screenHeight = window.innerHeight //瀏覽器窗口的內部高度 /* var screenHeight = document.documentElement.clientHeight; */ menuHeight.style.height=screenHeight-80+"px"; /*使用jQuery來實現*/ /****方法一****/ $('.menu').height($(window).height()-80); /****方法二****/ $('.menu').css("height",$(window).height()-80);