微信公眾號之input輸入框獲取焦點后,底部固定定位的按鈕頂起問題解決辦法


問題描述:手機H5頁面當input輸入框獲取焦點時,軟鍵盤會彈起,這時:IOS底部固定定位的按鈕不會隨着鍵盤彈起而彈起;而安卓底部固定定位的按鈕會跟隨軟鍵盤彈起而頂起,往往會遮擋一部分視圖,這對用戶的體驗有點不好,故本篇文章將利用js來解決這個問題,優化用戶體驗

1、解決思路

當軟鍵盤彈起時,將底部彈起的按鈕隱藏;當軟鍵盤收起時,將按鈕正常顯示。

2.上代碼

var h=$(window).height();//監聽頁面高度

$(window).resize(function() {

if($(window).height()<h){

  $('.要隱藏的按鈕class名稱').hide();

}else{

  $('.要顯示的按鈕class名稱').show();

}

})


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM