Javascriptは、ブラウザの種類やバージョン、環境により機能するものとしないものがあります。
また、DHTMLを使用している場合もあります。
※DHTMLについては「DHTMLサンプル」もご参照下さい。
■ マウスに追随する文字
◆ 実行サンプル
| 略号の説明 | 動作が確認できたブラウザ |
|---|---|
| IE6.0 NS7.0 MZ1.7.7 FF1.5 OP7.53 |
- 【記述サンプル】
-
まず、テキストエディタなどを使用し、次の記述を「mptxt2.js」というファイル名で保存します。
var msgstr0 = "【超初心者のホームページ作成】 "; msgstr0 = msgstr0.split(""); var x, y; var step = 16; var flag = 0; var xpos = new Array(); var ypos = new Array(); for (i = 0; i <= msgstr0.length - 1; i++) { xpos[i] = -50; } for (i = 0; i <= msgstr0.length - 1; i++) { ypos[i]= -50; } for (i = 0; i <= msgstr0.length-1; i++) { document.write("<span id='span"+i+"' style='color:#ff00ff;position:absolute;top:-50;'>"); document.write(msgstr0[i]); document.write("</span>"); } if (document.layers) { document.captureEvents(Event.MOUSEMOVE); } document.onmousemove = msg_dsp; dsp_strings(); function msg_dsp(e) { x = (document.layers) ? e.pageX : document.body.scrollLeft + event.clientX; y = (document.layers) ? e.pageY : document.body.scrollTop + event.clientY; flag = 1; } function dsp_strings() { if (flag == 1 && document.all) { for (i = msgstr0.length - 1; i >= 1; i--) { xpos[i] = xpos[i - 1] + step; ypos[i] = ypos[i - 1]; } xpos[0] = x + step; ypos[0] = y; for (i = 0; i < msgstr0.length - 1; i++) { var msgchr0 = eval("span" + (i) + ".style"); msgchr0.posLeft = xpos[i]; msgchr0.posTop = ypos[i]; } } else if (flag==1 && document.layers) { for (i = msgstr0.length - 1; i >= 1; i--) { xpos[i] = xpos[i - 1] + step; ypos[i] = ypos[i - 1]; } xpos[0] = x + step; ypos[0] = y; for (i = 0; i < msgstr0.length - 1; i++) { var msgchr0 = eval("document.span" + i); msgchr0.left = xpos[i]; msgchr0.top = ypos[i]; } } var timer = setTimeout("dsp_strings()", 10); }
次に、次のようなJavascriptの呼び出しを「body」タグの直後ぐらいに記述します。
<script type="text/javascript" src="./js/mptxt2.js"></script>