第５章　ポップアップウィンドウを作る

左の図のように、リンクされた語句やイメージをクリックすると 飛び出してくるのがポップアップウィンドウです。

作り方には、いくつかの方法がありますが、ここでは 一番汎用性のある作り方を解説します。

１．JavaScriptを記述したテキストファイルを作る
　　これに、フォントの指定や表示する文を記述しておく
２．トピックファイルのHTMLのヘッダ部分に１．のjsファイルを
　　呼び出すスクリプトを書く
３．HEADまたはBODY部分にOBJECTタグを挿入する
４．リンクしたいものをAタグで挟む

１．のjsファイルですが、HTMLの中にJavaScriptを記述する場合

　　<SCRIPT language="javascript">........</SCRIPT>

のように書きますが、......部分があまりに長いと見にくくなります。 そこで、スクリプト部分を他のファイルに書くことができます。 これがjsファイルです。

// test.js By Y.Kumei MyFont="MS ゴシック,12" MyText1="function, Cではあるひとかたまりの処理手順としての機能を記述したもの" MyText2="Beginner's All-purpose Symbolic Instruction Codeの略です"

コメントは//で入れることができます。

フォントの変数(上の例ではMyFont)="フォントフェイス名,フォントサイズ,キャラクターセット, (PLAIN, BOLD, ITALICまたはUNDERLINE)"

のようにフォント変数を指定します。省略するとデフォルトのものが使われます。

文字列変数(ここではMyText1, MyText2)="表示したい文字列"

改行したいところに「\n」を入れることもできます。

２．についてはHEAD部分に

<SCRIPT language="JavaScript" SRC="../test.js"> </SCRIPT>

のタグを入れます。SRCの所は１．で作ったファイル名です。 パスの区切りはスラッシュで表します。１つ上のフォルダは「..」で 表します。

３．HEADまたはBODY部分にOBJECTタグを挿入(ActiveXコントロールです)しますが、内容は 次のようにします。

<OBJECT id=NO2 type="application/x-oleobject" classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11" > </OBJECT>

id以外の所はすべて同じにしておいてください。idは自分で 任意に指定します。

さて、あとはポップアップウィンドウを出したいところをAタグで 挟みます。

<A HREF=JavaScript:NO2.TextPopup(MyText1,MyFont,9,9,-1,-1)>ここをクリック</A>

TextPopupはActiveXコントロールのメソッドです。

(OBJECTタグで指定したid).TextPopup(文字列変数, フォント変数, 左右のマージン, 上下のマージン, 文字色, 背景色)

のように使います。

しかし、文字色、背景色は自由に指定することができません。文字色は-1(黒)、 背景色は０(白)、-1(薄い黄色)となっています。

これで、ボップアップウィンドウを出すことができるようになりました。