前提：我們考慮兼容的環境為android和ios兩種智能手機
兼容環境測試結果顯示android的表現明顯好於ios，ios手機在軟鍵盤呼起收起時存在着很嚴重的兼容性問題
場景展示：
頁面正常狀態
軟鍵盤彈出時，懸掛元素丟失了指定位置
軟鍵盤未通過點擊完成而失去焦點時，頁面渲染發生崩潰性錯亂，手指滑動后頁面會恢復正常
我們再來看市面上比較強勢的webapp網站表現
場景展示：
淘寶等阿里旗下webapp網站均選擇回避在頁面上展示懸掛元素，或者在有懸掛元素時避免產生軟鍵盤彈出事件
百度帖子回復采用了頁面轉場模式，即在當前頁面渲染一個與本頁面無沖突的新頁面，這的確是一個很出色的辦法，但是目前我們還沒有在頁面轉場方面的研究和探索
百度貼吧搜索采用了設置固定的滾動區域，但是觸屏滑動動作在頁面滾動和區域滾動之間的體驗很差
現在我們來看webapp前端開發中，軟鍵盤基本工作原理
輸入框聚焦時，軟鍵盤彈出；如輸入框在可視界面底部，軟鍵盤彈出將遮擋它時，整個可視界面模塊會被軟鍵盤自動推上去，從而保持聚焦的輸入框在我們可視范圍
從viewport和軟鍵盤的原理上我們無從入手，我們甚至無法發現軟鍵盤彈出事件，無法獲取軟鍵盤高度，也無法通過輸入框聚焦與否判斷軟鍵盤是否彈出，於是只好選擇尋找合適該前提條件的兼容方法
市面上誕生諸如iscroll等webapp前端開發框架，在html頁面上設置固定的滾動區域，並從用戶感知體驗上優化了觸屏滑動動作在頁面滾動和區域滾動之間的沖突
它的原理是通過讓html頁面上的滾動元素與懸掛元素分離，從而避免軟鍵盤彈出時，對懸掛元素產生影響，外在表現是懸掛元素的工作方式不再是試圖吸附在可視界面的指定位置，因此因懸掛帶來的問題也就消失了
由此可以分析出iscroll解決問題的核心思路是——模擬fixed展示效果來替代fixed
於是我們最終選擇在ios下使用iscroll開發框架的方案來解決該問題
但是該方案並非就沒有自身的問題，如果頁面上輸入框元素在頁面最底部，軟鍵盤喚起時將產生輸入框間歇性對焦不工作的問題，導致聚焦元素被喚起的軟鍵盤遮擋
該問題導致用戶輸入文本內容時的體驗將會非常差
場景展示：
軟鍵盤彈出正常時
軟鍵盤彈出間歇性不正常時
在我們現有技術認知水平情況下，采取的方案是被動妥協的，我們的建議是在產品設計原型上，盡量回避輸入框元素出現在頁面最底部的場景
還有部分android手機機型、版本、瀏覽器也不支持position:fixed屬性
通過userAgent取得該手機的部分特性，然后與ios同樣處理，后遺症是一般這樣的手機比較落后，iscroll開發框架帶來的渲染會造成頁面滑動時很卡，甚至是抽搐狀態
userAgent代碼輸出示例：
document.write(navigator.userAgent);