Iframe

IFrame（ I nline F rame）は、別のURLのコンテンツを表示するためにHTMLページ内にフレームまたはウィンドウを作成するHTMLコードの一部です。

Moodleでは、次のようなコンテンツを表示するのに適した方法です。

Googleカレンダー、Microsoft Outlook Webカレンダー、AppleMobilemeカレンダーなどの外部サイトからのカレンダー。
現在のコンテンツを含むWebページ:例:天気
現在のMoodleコース外のネットワークロケーションからのコンテンツ（例:別のMoodleコース、htmlページのネットワークファイル）
Google Picasaウェブアルバム、YouTubeなどのiFrameを介してコンテンツを配信するサイトのコンテンツ。

注:画面の幅は1200ピクセル幅であることが多いため、1000ピクセルまでのiFrameで十分な場合がよくあります。

IFrameのサイズは周囲のHTMLページで指定できるため、IFrameの読み込み中に、周囲のページをブラウザに表示できます。 IFrameはインライン画像のように動作し、ユーザはそれをスクロールして非表示にすることができます。一方、IFrameには、周囲のページのスクロールバーとは関係なく、独自のスクロールバーを含めることができます。

セキュリティ上の理由から、moodleではどこでもiframeを使用することはできません。一般に、iframeコードは、課題の提出、Wiki、フォーラム、データベース、用語集、ブログの活動など、すべてのクラスメンバーが貢献できるMoodle活動では許可されていません。これらの活動では、iframeに埋め込まれたビデオがHTMLエディタに表示されますが、投稿または送信が保存されると削除されます。

注意: すべてのブラウザがIFrameを認識するわけではありません。ただし、Mozilla Firefox、Opera、およびMicrosoft Internet Explorerでは、contentEditableとdesignModeが導入されました。これにより、ユーザはIFrameに含まれるHTMLのコンテンツを編集できます。いくつか例を挙げると、Google Docs＆Spreadsheets（以前のWritely）、JotSpot Live、Windows LiveHotmailなどのこの機能を利用する人気のあるWebアプリケーション。

注: 多くのWebサイトでは、ページをiframeでレンダリングすることを許可していません（これは、X-Frame-OptionsHTTP応答ヘッダーdocs / Web / HTTP / Headers / X-Frame-Options）。

ターゲットのWebアドレスでiframe機能が許可されるかどうかを確認するWebサイト（グーグルで検索できます）があります。

コード例

iframeを作成するには、

セクションヘッダー、ラベル、Webページ、またはフォーラム投稿を編集します
HTMLコード表示をオンにします
次のコードをどこかに貼り付けます

次の例では、300 x 600 pixtelのスクロール可能なウィンドウを作成し、AdobeReaderとその中のファイルを開きます。

使用例

Iframeを使用してPDFファイルを課題に挿入する方法の例を次に示します。

コース内で、PDFをコースファイル領域にアップロードします
それが終わったら、ファイルをクリックして、ブラウザのアドレスバーにそのURLアドレスをメモします。
1. ヒント:ブラウザウィンドウからURLをコピーし、メモ帳にポップします。または、2番目のブラウザウィンドウを開いてPDFファイルを見つけ、そのウィンドウからコードで開いているウィンドウにURLアドレスをコピーします。
新しい課題を作成する（オンラインテキスト）
説明については、エディタでビューをHTMLビューに変更し、手順2でメモしたPDFURLを指すiFrameのHTMLコードを埋め込みます。
WYSIWYGモードに戻り、新しく表示されたiframeの下に質問を追加します
Saveを実行すると、学生は、回答を入力するウィンドウと同じウィンドウでスクロール可能なPDFを表示できるようになります。

これは以下を生み出しました:

Iframe example showing scroll bars in a student view

Documentation

Iframe

コード例

使用例

関連項目