文字に触るとサブウインドウが開いて、クリックすると指定したページへリンクします。
応用 : サブウインドウの中にHTMLが記述できますから、ページを作るようにしてサブウインドウを記述してみましょう。
参照 : function, 変数, window.open, document.write(), document.close(), onMouseover,
この文字に触ると説明ウインドウが開き、クリックするとリンクへ跳びます
<html>
<head>
<title></title>
<script language="JavaScript">
<!--
function d12(MSG1,MSG2,W,H){
//サブウインドウオープン
var win12=window.open('',(W+'')+(H+''),'scrollbars=1,width='+W+',height='+H+'');
//ここの括弧の中にサブウインドウ内のhtmlを記述します。
win12.document.write('<body bgcolor="#b8860b">');
win12.document.write('<table border=10 width=50%><tr><td>');
win12.document.write('</td></tr></table>');
win12.document.write('<font size=5 face="Osaka,ＭＳ Ｐゴシック">');
win12.document.write( MSG1 );
win12.document.write('</font>');
win12.document.write('<br>');
win12.document.write('<font size=4 face="Osaka,ＭＳ Ｐゴシック">');
win12.document.write('<b>');
win12.document.write( MSG2 );
win12.document.write('</b>');
win12.document.write('</font>');
win12.document.close();
}
//-->
</script>
</head>
<body>
<a href="link.htm"
onMouseOver="
msg1='説明1';
msg2='むかしむかしあるところに........';
d12(msg1,msg2,200,100)">
この文字に触ると説明ウインドウが開き、クリックするとリンクへ跳びます
</a>
</body>
</html>
<!--LINK.HTMのソースです-->
<html>
<head>
</head>
<body bgcolor="#8a2be2">
<table border="10" width="50%"><tr><td>
<font size="8" face="Osaka,ＭＳ Ｐゴシック" color="#000000">
おじ さんと<br>
おば さんが<br>
住んでいました。<br>
</font>
</td></tr></table>
</body>
</html>
window.openに関する説明はwindow.openをご覧くださいfunction d12(msg1,msg2,W,H)で、msg1,msg2,W,Hの4つの変数を受け取る事のできるd12()という名前の関数を作ります。これは、たとえば あとで、d12('山','川',200,100)という風に使うことで、msg1='山',msg2='川',W=200,H=100を指定たうえでd12()を実行するのと同じように使うことができます
win12.document.write('xxx')はサブウインドウwin12の中に'xxx'を書き出す(document.writeする)という意味で、
その次のwin12.document.close()はサブウインドウwin12に'xxx'を書き出すのをやめる(document.closeする)という意味です
onMouseover="命令文"でマウスカーソルが触ったら"命令文"を実行するという意味です
| CONTENTS
| PART1 これだけ知っていれば大丈夫
| PART2 サンプルの紹介
| PART3 JavaScript言語仕様
| PART4 JavaScriptクイック書式一覧
| PART5 JavaScriptサイト
| オンラインサポートページ(回線をつないでください)