ホームページ ウェブフロントエンド jsチュートリアル IFrame クロスドメインの適応性の高い実装コード_JavaScript スキル

IFrame クロスドメインの適応性の高い実装コード_JavaScript スキル

May 16, 2016 pm 05:50 PM
アダプティブ

复制代 代码如下:

var iframeids = ['memberIndexIframe','inquiryCenterIframe','everychinaBbsIframe' ];
var iframehide = "はい";
関数 dynIframeSize(){
var dyniframe = [];
for(var i=0;iif(!document.getElementById) return false;
dyniframe[i] = document.getElementById(iframeids[i]);
if(dyniframe[i] && !window.opera){
dyniframe[i].style.display = "ブロック";
if(dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight){
dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight;
}else if(dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight){
dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;
}
}
if((document.all || document.getElement) && iframeids == "no") {
var Tempobj = document.all?document.all[iframeids[i] ] : document.getElementById(iframeids[i]);
tempobj.style.display = "ブロック";
}
}
}
if (window.addEventListener)
window.addEventListener("load", dynIframeSize, false)
else if (window.attachEvent)
ウィンドウ.attachEvent("onload", dynIframeSize)
else {
window.onload = dynIframeSize;
}

上の代コードに直接保存されているファイル iframe.js をすぐに参照できます

注意:この段代コードはフィールド全域の iframe を参照できません。 iframe の高さを特に指定する必要があります

下にあるこの代コードは、フィールド全体の iframe の高さです

目地网站内に嵌合作网站の页面が必要です、これには页面の自适应が必要ですネットワーク上では、広範囲にわたる IFrame の適切な高さを実現するために、多くのリソースが追加されています。挿入された方の b.html、ここでは iframe 方式で実現される
a.html页面の主要代コード:


代制コード代码如下:

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

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Windows 11 でコンテンツの適応型明るさを設定する方法 Windows 11 でコンテンツの適応型明るさを設定する方法 Apr 14, 2023 pm 12:37 PM

明るさの調整は、表示されているコンテンツや照明条件に基づいて画面の明るさレベルを調整する Windows 11 コンピューターの機能です。一部のユーザーはまだ Windows 11 の新しいインターフェイスに慣れていないため、明るさの自動調整機能を簡単に見つけることができず、明るさの自動調整機能が Windows 11 にないという人もいます。そのため、このチュートリアルですべてを解決します。たとえば、YouTube ビデオを視聴していて、ビデオに突然暗いシーンが表示された場合、明るさの調整により画面が明るくなり、コントラスト レベルが上がります。これは、コンピュータ、スマートフォン、またはデバイスが周囲の照明に基づいて明るさレベルを調整できるようにする画面設定である自動明るさとは異なります。フロントカメラには特別なものがあります

Vue を使用してアダプティブ モバイル インターフェイスを構築するにはどうすればよいですか? Vue を使用してアダプティブ モバイル インターフェイスを構築するにはどうすればよいですか? Jun 27, 2023 am 11:05 AM

モバイル インターネットの普及に伴い、モバイル エクスペリエンスを考慮する必要がある Web サイトやアプリケーションがますます増えています。人気のあるフロントエンド フレームワークとして、Vue には応答性の高いレイアウトと適応機能があり、適応モバイル インターフェイスの構築に役立ちます。この記事では、Vue を使用してアダプティブ モバイル インターフェイスを構築する方法を紹介します。単位として px の代わりに rem を使用したり、モバイル インターフェイスの単位として px を使用したりすると、さまざまなデバイスで表示効果に一貫性がなくなる可能性があります。したがって、単位として px ではなく rem を使用することをお勧めします。レムは相対的なものです

CSS ビューポート単位 vmin および vw を使用してアダプティブ画像サイズを実装する方法 CSS ビューポート単位 vmin および vw を使用してアダプティブ画像サイズを実装する方法 Sep 13, 2023 am 08:18 AM

CSSViewport ユニット vmin および vw を使用して適応型画像サイズを実装する方法 Web デザインでは、画像を画面サイズに適応させる必要がある状況によく遭遇します。この目標を達成するために、CSS はビューポート ユニットという強力なユニットを提供します。このうち、vmin はビューポート幅の小さい方の割合を表し、vw はビューポート幅の割合を表します。したがって、これら 2 つのユニットを使用して、適応型画像サイズの効果を実現できます。具体的には以下でご紹介します

CSS ビューポート: vmax と vw を使用して適応型テキスト幅を実装する方法 CSS ビューポート: vmax と vw を使用して適応型テキスト幅を実装する方法 Sep 13, 2023 am 10:16 AM

CSSViewport: vmax と vw を使用してアダプティブ テキスト幅を実装する方法 モバイル デバイスの普及に伴い、レスポンシブ デザインは Web デザインにおける重要な概念になりました。中でも、異なる画面サイズでも一貫した表示効果を維持するための適応型テキスト幅は重要な技術です。この記事では、CSSViewport ユニット、特に vmax ユニットと vw ユニットを使用して、適応型テキスト幅を実装する方法を紹介します。理論的な説明に加えて、具体的な説明も提供します。

PHP8.0 の Adaptive Server PHP8.0 の Adaptive Server May 14, 2023 pm 01:10 PM

2020 年 11 月 26 日に、PHP チームは PHP 8.0 バージョンを正式にリリースしました。以前のバージョンと比較して、PHP 8.0 は多くの新機能と改善をもたらしました。注目に値する機能の 1 つはアダプティブ サーバーです。この記事では、PHP8.0におけるアダプティブサーバーの概念とその利点を紹介します。以前の PHP バージョンでは、開発者は PHP 独自のサーバー (PHP-FPM、Apache など) を使用して独自のコードを実行できました。ただし、これらのサーバーの欠点は

CSS Flex レイアウトを使用してアダプティブ グリッドを実装する方法 CSS Flex レイアウトを使用してアダプティブ グリッドを実装する方法 Sep 26, 2023 pm 12:45 PM

CSSFlex エラスティック レイアウトを使用してアダプティブ グリッドを実装する方法 はじめに: Web デザインでは、グリッド レイアウトは非常に一般的なレイアウト方法です。Web ページを均一なグリッドに分割し、さまざまなサイズの画面に適応させることができます。 CSSFlex エラスティック レイアウトは、アダプティブ グリッド レイアウトを実装するためのシンプルかつ強力な方法を提供します。この記事では、CSSFlex エラスティック レイアウトを使用してアダプティブ グリッドを作成する方法を紹介し、具体的なコード例を示します。 1. 基本的な手順: HTML を作成する

vue は適応可能ですか? vue は適応可能ですか? Dec 30, 2022 pm 03:25 PM

Vue は自己適応を実現できます。自己適応を実現する方法は次のとおりです: 1. 「npm install」または「yarn add」コマンドを使用して「scale-box」コンポーネントをインストールし、「scale-box」を使用して適応スケーリングを実現します。 ; 2. 自己適応を実現するためにデバイスのピクセル比を設定します; 3. JS を通じてズーム属性を設定し、自己適応を達成するためにズーム率を調整します。

PHP を使用してアダプティブ Web サイト デザインを実装する PHP を使用してアダプティブ Web サイト デザインを実装する Jun 22, 2023 pm 05:50 PM

現在のインターネット時代において、ウェブサイトのデザインはますます重要になっています。デザイナーと開発者は、デバイスの解像度、画面サイズ、オペレーティング システムの違いなどの問題を考慮する必要があります。そして、これらの変数により、Web サイトの適応性がさらに必要になります。 PHP は、応答性の高い Web サイトの開発に使用できる人気のあるプログラミング言語です。この記事では、PHP を使用してレスポンシブ Web サイト デザインを実装する方法と、いくつかの実践的なヒントを紹介します。レスポンシブ Web サイトのデザインとは何ですか?アダプティブ Web サイト デザインとは、

See all articles