javascript - 如何讓行動網頁的輸入框固定在底部?
仅有的幸福
仅有的幸福 2017-06-24 09:43:57
0
5
974

#如上圖展示,在首頁上使用者點選輸入框,彈出鍵盤,有時候會把輸入框部分遮擋住(如下圖)

#目前的處理方式是,當輸入框獲得焦點後,執行resize

$('input').on('focus' , function(){
    $(window).resize();
}).on('blur' , function() {
    $(window).resize();
});

這麼做就是為了重置視窗大小,讓原本浮動在底部的輸入框,重新定位
但是效果不太好,時而生效,時而失效

#像這樣的情況應該使用什麼方式來更好的處理這個問題?
還有在彈出鍵盤的同時,滾動頁面也能保持讓輸入區域固定在底部

目前輸入框的定位方式是:position:fixed
截圖環境:ios 微信端

仅有的幸福
仅有的幸福

全部回覆(5)
阿神

輸入框 你可以用 flex 固定在底部試試,flex 固定到底部可查考 sticky-footer

刘奇

建議你用js去計算,用 window.innerHeight

漂亮男人

http://www.cnblogs.com/cococe...
試試這個

漂亮男人

樓上說的對,可以用flex ,那些打廣告的都是採用這個屬性。我覺得這個能解決你的問題

洪涛

網址:http://www.haorooms.com/post/...
原理: ios 不要用 fixed,改使用 absolute。
完。

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!