javascript - 如何讓移動端網(wǎng)頁的輸入框固定在底部?
問題描述
如上圖展示,在首頁上用戶點擊輸入框,彈出鍵盤,有時候會把輸入框部分遮擋住(如下圖)
目前的處理方式是,當(dāng)輸入框獲得焦點后,執(zhí)行resize
$(’input’).on(’focus’ , function(){ $(window).resize();}).on(’blur’ , function() { $(window).resize();});
這么做就是為了重置窗口大小,讓本來浮動在底部的輸入框,重新定位但是效果不太好,時而生效,時而失效
像這樣的情況應(yīng)該使用什么方式來更好的處理這個問題?還有在彈出鍵盤的同時,滾動頁面也能保持讓輸入?yún)^(qū)域固定在底部
目前輸入框的定位方式是:position:fixed截圖環(huán)境:ios 微信端
問題解答
回答1:輸入框 你可以使用 flex 來固定到底部試試,flex 固定到底部可查考 sticky-footer
回答2:建議你用js去計算,使用 window.innerHeight
回答3:http://www.cnblogs.com/cococe...試試這個
回答4:樓上說的對,可以用flex ,那些打廣告的都是采用這個屬性。我覺得這個能解決你的問題
回答5:地址:http://www.haorooms.com/post/...原理: ios 不要用 fixed,改使用 absolute。完。
相關(guān)文章:
1. javascript - 能否讓vue-cli的express修改express重啟服務(wù)2. 解決Android webview設(shè)置cookie和cookie丟失的問題3. javascript - gulp打包引入文件路徑在生產(chǎn)環(huán)境和開發(fā)環(huán)境下的切換4. node.js - npm一直提示proxy有問題5. python - 我想把下面代碼中的多余空白行去除該怎么做,如何用正則實現(xiàn)6. PHP單例模式7. 最新版本的微信web開發(fā)者工具必須要APPID,會提供測試號,但是像你一樣tabBar配置的話不會顯示首頁與日志,難道我要下載跟你一樣的版本?8. 網(wǎng)頁爬蟲 - python爬蟲翻頁問題,請問各位大神我這段代碼怎樣翻頁,還有價格要登陸后才能看到,應(yīng)該怎么解決9. python - tweepy 庫 連接Twitter API 報錯10. python - 網(wǎng)頁title中包含換行,如何用正則表達(dá)式提取出來?
