## フレーム

トップ > 逆引きリファレンス > フレーム

#### ■ フレームに分割するには

ウィンドウを複数のフレームに分割するには <frameset> を用います。詳細は <frameset> を参照してください。

    <frameset cols="150,*">
     <frame src="page1.htm" name="left">
     <frame src="page2.htm" name="right">
    </frameset>

#### ■ フレームの境界線を無くすには

<frameset> タグに frameborder=0 と border=0 属性を指定します。

    <frameset cols="150,*" frameborder=0 border=0>
       :

#### ■ フレームの境界線を固定するには

<frame> タグに noresize 属性を指定してください。

    <frameset cols="150,*">
     <frame src="frame1.htm" noresize>
     <frame src="frame2.htm" noresize>
    </frameset>

#### ■ 別フレームの内容を書きかえるには

左フレームに目次を、右フレームにその内容を表示させたいときは、まず <frame> タグに name 属性を指定して右フレームに名前をつけておき、左フレームの <a href="..."> に target 属性を指定してやります。

    ======<index.htm>======
    <html>
    <head><title>テスト</title></head>
    <frameset cols="150,*">
     <frame name="hidari" src="content.htm">
     <frame name="migi" src="main.htm">
    </frameset>
    </html>

    ======<content.htm>======
       :
    <a href="xxx.htm" target="migi">XXX</a>
       :

#### ■ フレームを解除するには

フレームを解除するには、target 属性に "_top" を指定します。

    <a href="top.htm" target="_top">トップページ</a>

#### ■ 複数のフレームを同時に書きかえるには

JavaScript を用います。FRAME1、FRAME2 は、<frame name="〜"> でつけた名前です。

    <script type="text/javascript">
    <!--
    function func() {
       top.FRAME1.location.href = "aaa.htm";
       top.FRAME2.location.href = "bbb.htm";
       return false;
    }
    // -->
    </script>
    <a href="#" onclick="return func()">XXX</a>

#### ■ インナーフレームを置くには

ページの中央などに、インナーフレームを置くには <iframe> を用います。

    <iframe src="index.html" height=100 width=300></iframe>

#### ■ JavaScriptで他のフレームを参照するには

JavaScript で他のフレームを参照するには、window（このフレーム、このウィンドウ）、parent（ひとつ親のフレーム）、top（トップフレーム）などの予約キーワードや、<frame> タグの name 属性で指定したフレーム名を使用します。下記の例では、最初の 2行は自フレームのフォームを参照し、3行目はトップの下にある frame2 という名前のフレームの中のフォームを参照しています。

    <script type="text/javascript">
    <!--
    function func() {
      alert(document.form1.text1.value);      // 省略時は自フレーム
      alert(window.document.form1.text1.value); // 自フレーム
      alert(top.frame2.document.form2.text2.value);
    }
    // -->
    </script>

#### ■ フレームのタイトルをタイトルバーに表示するには

top.document.title に代入することにより、タイトルバーに表示されるタイトルを動的に変更することができます。フレームのメインページの先頭に下記のスクリプトを埋め込むことで、フレームの子ページのタイトルをタイトルバーに表示することが可能になります。

    <script type="text/javascript">
    <!--
    top.document.title = document.title;
    // -->
    </script>

Copyright (C) 2003 杜甫々
初版： 2003年10月12日、最終更新：2003年10月25日
http://www.tohoho-web.com/how2/frame.htm