ホームページ  >  記事  >  ウェブフロントエンド  >  WeChat ページにキーボードが表示された後、iframe コンテンツが空白になる

WeChat ページにキーボードが表示された後、iframe コンテンツが空白になる

小云云
小云云オリジナル
2018-02-12 09:13:271566ブラウズ

この記事では主に、WeChat ページでキーボードがポップアップした後に iframe コンテンツが空白になる問題の解決策を説明します。キーボードが表示されると、フッターも押し上げられ、検索が完了すると (ページ全体を更新する必要があります)、キーボードが格納された後、iframe 内のキーボードが存在する場所が白になります。

前書き:

iframe を調整する必要があるため、高さを計算する必要があります

//整体高
var win = $(window).height();
//搜索栏
var header = $('header').height();
//导航栏
var nav = $('.navpwrap').height();
//页底
var footer = $('footer').height();
//iframe
$('#main').height(win -header + nav - footer);

解決策:

原因:

キーボードを置いたときに iframe の高さが調整されないリセット。

オプション①: 最初の iframe の高さを Cookie に入れます

注: Xiaomi 6 では、「win」が競合するようですので、「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;
}

関連する推奨事項:

ボーダーレス iframe とボーダーレス iframe の操作は何ですか?

iframe を使用して現在の Web ページに他の Web ページを埋め込む方法

HTML は iframe がページにジャンプすることを防ぎ、iframe を使用して WeChat Web バージョンをページに埋め込みます

以上がWeChat ページにキーボードが表示された後、iframe コンテンツが空白になるの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。