記響應式佈局vh/vw單位在安卓端微信瀏覽器以及UC瀏覽器的坑

頁面使用vh來控制元素高度的時候,在安卓端瀏覽器虛擬鍵盤彈出時,導致視口高度改變,以至於vh的取值改變

// 正常模式下
100vh = document.documentElement.clientHeight;

// 安卓端彈出虛擬鍵盤情況下

100vh = document.documentElement.clientHeight - 虛擬鍵盤的高度;

這種情況導致了在虛擬鍵彈出的時候,頁面中使用vh定高的元素的大小被壓縮,造成佈局錯位以及文字溢出。

暫未找到有效的前端解決方法。

將帶有輸入框的頁面元素使用px進行佈局暫時修復。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章