微信頁面彈出鍵盤后iframe內(nèi)容變空白的解決方案
當(dāng)鍵盤彈出后,頁腳也被頂起來;而當(dāng)搜索完(要刷新整體頁面),鍵盤縮回后,iframe里 鍵盤當(dāng)住的地方變成白色。
前言:
因?yàn)閕frame要適配,so,高度要計(jì)算出來
//整體高 var win = $(window).height(); //搜索欄 var header = $('header').height(); //導(dǎo)航欄 var nav = $('.navdivwrap').height(); //頁底 var footer = $('footer').height(); //iframe $('#main').height(win -header + nav - footer);
解決方案:
原因:
當(dāng)鍵盤放下后,iframe的高度沒有再重新設(shè)置而導(dǎo)致的。
方案① : 將首次iframe的高度放在cookie里
注意:在小米6 中,'win' 貌似沖突了,so 改 ‘win1'
//導(dǎo)入 <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)容變空白的解決方,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
JavaScript 自定義彈出窗口的實(shí)現(xiàn)代碼
這篇文章主要介紹了JavaScript 自定義彈出窗口的實(shí)現(xiàn)代碼,實(shí)現(xiàn)一采用html編寫彈出窗口內(nèi)容,實(shí)現(xiàn)二采用JavaScript編寫彈出窗口內(nèi)容,結(jié)合示例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2023-09-09two.js之實(shí)現(xiàn)動(dòng)畫效果示例
本篇文章主要介紹了two.js之實(shí)現(xiàn)動(dòng)畫效果示例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-11-11javascript獲取以及設(shè)置光標(biāo)位置
本文介紹了javascript獲取以及設(shè)置光標(biāo)位置的方法,具有很好的參考價(jià)值,下面跟著小編一起來看下吧2017-02-02JavaScript設(shè)計(jì)模式之原型模式分析【ES5與ES6】
這篇文章主要介紹了JavaScript設(shè)計(jì)模式之原型模式,簡(jiǎn)單描述了原型模式的概念、原理,并結(jié)合實(shí)例形式分析了ES5與ES6實(shí)現(xiàn)原型模式的相關(guān)操作技巧,需要的朋友可以參考下2018-07-07JavaScript中window.open用法實(shí)例詳解
這篇文章主要介紹了JavaScript中window.open用法,實(shí)例分析了window.open方法的功能、參數(shù)及使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-04-04Javascript實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊冒泡特效
這篇文章主要為大家詳細(xì)介紹了Javascript實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊冒泡特效,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-12-12JavaScript實(shí)現(xiàn)自定義拖拽排序列表
在Web開發(fā)中,拖拽排序是一個(gè)常見的需求,它允許用戶通過拖拽的方式重新排列列表項(xiàng)的順序,本文將介紹如何使用原生JavaScript實(shí)現(xiàn)這一功能,需要的可以了解下2024-01-01