微信頁面彈出鍵盤后iframe內(nèi)容變空白的解決方案
更新時間:2017年09月20日 16:26:42 作者:fanfan4569
當鍵盤彈出后,頁腳也被頂起來;而當搜索完(要刷新整體頁面),鍵盤縮回后,iframe里 鍵盤當住的地方變成白色。怎么解決這個問題呢?下面腳本之家小編給大家分享微信頁面彈出鍵盤后iframe內(nèi)容變空白的解決方案,一起看看吧
當鍵盤彈出后,頁腳也被頂起來;而當搜索完(要刷新整體頁面),鍵盤縮回后,iframe里 鍵盤當住的地方變成白色。
前言:
因為iframe要適配,so,高度要計算出來
//整體高 var win = $(window).height(); //搜索欄 var header = $('header').height(); //導航欄 var nav = $('.navdivwrap').height(); //頁底 var footer = $('footer').height(); //iframe $('#main').height(win -header + nav - footer);
解決方案:
原因:
當鍵盤放下后,iframe的高度沒有再重新設(shè)置而導致的。
方案① : 將首次iframe的高度放在cookie里
注意:在小米6 中,'win' 貌似沖突了,so 改 ‘win1'
//導入 <script src="jquery.cookie.js"></script> var win = $(window).height(); //獲取cookie里 var winCookie = $.cookie("win1",{path: '/' }); //若cookie里無,則填充;若cookie里有,則取出 if(!winCookie){ $.cookie("win1", win,{path: '/' }); }else{ win = winCookie; }
總結(jié)
以上所述是小編給大家介紹的微信頁面彈出鍵盤后iframe內(nèi)容變空白的解決方,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
JavaScript設(shè)計模式之原型模式分析【ES5與ES6】
這篇文章主要介紹了JavaScript設(shè)計模式之原型模式,簡單描述了原型模式的概念、原理,并結(jié)合實例形式分析了ES5與ES6實現(xiàn)原型模式的相關(guān)操作技巧,需要的朋友可以參考下2018-07-07