資訊專欄INFORMATION COLUMN
摘要：瀏覽器后，被軟鍵盤(pán)遮蓋的問(wèn)題，已經(jīng)有好多人問(wèn)相關(guān)的問(wèn)題，應(yīng)該是問(wèn)的角度不一樣，還的再次提出咯。如上循環(huán)，問(wèn)題無(wú)法解決。
safari瀏覽器fixed后，被軟鍵盤(pán)遮蓋的問(wèn)題，已經(jīng)有好多人問(wèn)相關(guān)的問(wèn)題，應(yīng)該是問(wèn)的角度不一樣，還的再次提出咯。
問(wèn)題描述測(cè)試環(huán)境：ios 10.2/10.3
簡(jiǎn)單來(lái)說(shuō)就是在html5頁(yè)面中底部有個(gè)fixed的區(qū)域，如圖
在點(diǎn)擊輸入框的時(shí)候，軟鍵盤(pán)彈出，遮蓋了fixed區(qū)域（這里頁(yè)面整體上移了），如圖
但是當(dāng)你點(diǎn)擊“完成”讓軟鍵盤(pán)收起，再次點(diǎn)擊輸入框的時(shí)候，what？一切正常了～！如圖（就是要這樣子的嘛，之后收起彈出軟鍵盤(pán)都正常了，不會(huì)遮蓋fixed底部區(qū)域了?。?/p>
但是，但是，還沒(méi)完，在輸入框里隨便輸入點(diǎn)內(nèi)容，點(diǎn)擊“提交”，關(guān)閉軟鍵盤(pán)，之后再次點(diǎn)擊輸入框，問(wèn)題依舊～，軟鍵盤(pán)再次遮擋fixed區(qū)域。
關(guān)閉軟件票，再次點(diǎn)擊輸入框，就不會(huì)遮擋fixed區(qū)域了。
如上循環(huán)，問(wèn)題無(wú)法解決。
測(cè)試代碼如下代碼很簡(jiǎn)單，但還是貼一下，方便測(cè)試，只需要復(fù)制粘貼到本機(jī)即可測(cè)試上述現(xiàn)象
fixed測(cè)試頁(yè)面
頂部固定區(qū)域
嘗試過(guò)的解決方案
搜索后有很多解決方法，但發(fā)現(xiàn)他們都沒(méi)解決上述問(wèn)題，
暫時(shí)的想法，繞過(guò)fixed，用戶點(diǎn)擊輸入框后，隱藏此區(qū)域，在頂部出現(xiàn)更大的輸入?yún)^(qū)域以讓用戶輸入內(nèi)容。
IOS中彈出鍵盤(pán)后出現(xiàn)fixed失效現(xiàn)象的解決方案
移動(dòng)端解決fixed和input獲取焦點(diǎn)軟鍵盤(pán)彈出影響定位的問(wèn)題
虛擬鍵盤(pán)與fixed帶給移動(dòng)端的痛
使用iScroll.js解決ios4下不支持position:fixed的問(wèn)題
好，至此，問(wèn)題描述完畢，期待有牛人更好解決方案
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/111816.html
摘要：參考地址首先，是這樣的布局父容器里面放一個(gè)輸入框和一個(gè)按鈕思路是父容器定位，為，為布局在其他事件觸發(fā)輸入框出現(xiàn)的時(shí)候例如一個(gè)評(píng)論的，父容器值變?yōu)?，被軟鍵盤(pán)頂上來(lái)。 參考地址： https://segmentfault.com/a/11...https://blog.csdn.net/github_... 1.首先，是這樣的布局：父容器里面放一個(gè)輸入框 和一個(gè)按鈕 思路是：父容器fi...
摘要：?jiǎn)栴}描述吸底的聚焦后，彈出的軟鍵盤(pán)將吸底的元素完全或者部分遮擋。然后導(dǎo)致元素被軟鍵盤(pán)遮擋高度為的高度。軟鍵盤(pán)的高度變化會(huì)觸發(fā)瀏覽器的事件。 移動(dòng)端做一個(gè)吸底的輸入框，首先需要注意兩大類設(shè)備，安卓和ios下的瀏覽器。特別是在ios下，輸入框聚焦時(shí)fixed定位會(huì)出現(xiàn)一些問(wèn)題，網(wǎng)上也有許多相關(guān)的帖子，在此就不再贅述了。今天要提及的是小米全面屏下的miui瀏覽器。問(wèn)題描述：吸底的input聚...
摘要：?jiǎn)栴}描述吸底的聚焦后，彈出的軟鍵盤(pán)將吸底的元素完全或者部分遮擋。然后導(dǎo)致元素被軟鍵盤(pán)遮擋高度為的高度。軟鍵盤(pán)的高度變化會(huì)觸發(fā)瀏覽器的事件。 移動(dòng)端做一個(gè)吸底的輸入框，首先需要注意兩大類設(shè)備，安卓和ios下的瀏覽器。特別是在ios下，輸入框聚焦時(shí)fixed定位會(huì)出現(xiàn)一些問(wèn)題，網(wǎng)上也有許多相關(guān)的帖子，在此就不再贅述了。今天要提及的是小米全面屏下的miui瀏覽器。問(wèn)題描述：吸底的input聚...
閱讀 2000·2021-09-07 10:24
閱讀 2098·2019-08-30 15:55
閱讀 2050·2019-08-30 15:43
閱讀 676·2019-08-29 15:25
閱讀 1069·2019-08-29 12:19
閱讀 1950·2019-08-23 18:32
閱讀 1527·2019-08-23 17:59
閱讀 956·2019-08-23 12:22
