ホームページ  >  記事  >  ウェブフロントエンド  >  lauiuiadminのiframe版がiosシステムページに適応できない問題の解決方法のご紹介

lauiuiadminのiframe版がiosシステムページに適応できない問題の解決方法のご紹介

不言
不言オリジナル
2018-08-25 11:24:415933ブラウズ

この記事の内容は、layuiadmin の iframe バージョンが iOS システム ページに適応できない問題の解決策に関するものです。必要な方は参考にしていただければ幸いです。

layuiadmin の公式デモの iframe バージョンは Android では正常に動作しますが、ios では iframe ページが適応できないという問題が発生します。
Baidu や Google をさまざまに調べ、最終的にインターネット上のいくつかの方法を組み合わせた結果、この問題は完全に解決されたようです。
実際、やり方は非常に簡単で、iosであれば取得した画面パラメータを元にjsを使ってiframeページの幅を強制的に制限するだけです。
効果は以下の通りです:
修正前:
lauiuiadminのiframe版がiosシステムページに適応できない問題の解決方法のご紹介

lauiuiadminのiframe版がiosシステムページに適応できない問題の解決方法のご紹介


修正方法: lauiuiadminのiframe版がiosシステムページに適応できない問題の解決方法のご紹介1. i に埋め込まれた各ページに

を追加します。フレーム などの ID 2. jquery を導入し、js コードを追加します:

lauiuiadminのiframe版がiosシステムページに適応できない問題の解決方法のご紹介

var ua = navigator.userAgent.toLowerCase();
    var screenwidth = window.screen.width;
    if(!/iphone|ipad|ipod/.test(ua)){
        $("#iosiframe").attr("scrolling","auto");
    }else{
        $('#iosiframe').width(screenwidth + 'px');
    }

注: 将来的には、上記のコードを直接layui.jsに追加することもできます。

を追加するには ID を指定するだけです。

正直、layuiadminは学習用なので正規版は買えません。公式サイトのデモからスキンを引っ張ってきたので、自分でテストしてみましたが、テスト後に他に問題がないかどうかを確認します。

関連する推奨事項:

親ページの iframe の高さは子ページの iframe height_html/css_WEB-ITnose に自動的に適応します

ページは携帯電話の画面のサイズに適応できますが、内部の画像は適応できません

以上がlauiuiadminのiframe版がiosシステムページに適応できない問題の解決方法のご紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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