今回は文字を１文字ずつ表示させるという効果です。
文字を１文字ずつ表示させる
| 今回の効果は、アニメーション画像を使わないで、１文字ずつ順番に文字を表示させるものです。 アニメーション画像を使うと、ファイルが重くなります。 画像を使わないで今回のような効果を使うことができれば、動きのあるダイナミックなページ作りが可能になります。 表示できるバージョンを、ネットスケープとエクスプローラと両方書いておかなければならないので面倒くさい部分がありますが、頑張って使ってみて下さい｡ 今月も少しだけこの実験にお付き合い下さい。 |
 ポイント | obj { color:white;font-size:20pt;font-weight:bold;font-family:Arial }で、表示させる文字の色・サイズ・太字にするかどうか・フォントの種類を指定します。 #lay { top:180px;left:100px; }で、文字を表示させる位置を指定します。 |
 効果 | msg = " ";に記入した文字が、timer = setTimeout("typeText()",200);に書かれた時間ごとに一つずつ表示されます。 |
 使い方 | 実際の実験画面のソースをご覧下さい。 |
今回の実験でわかったこと
| この効果は、Ｎｅｔｓｃａｐｅ４．０、Ｅｘｐｌｏｒｅｒの４．０以上でできます。 ただ、Ｎｅｔｓｃａｐｅは、４．５だと全角の日本語もちゃんと表示されるのですが、バージョン４．０１だと全角の文字を表示させようとすると、自分が表示させたい文字が出る前に「・」が出てしまいます。半角英数字だと「・」は出ません。 JavaScriptを使用しているので面倒ですが、ソースをそのままコピーしていただいて、文字の色や大きさ、表示させる位置、時間の間隔等を変えてみて、自分のページに合うようにアレンジしてみて下さい。 |
ご意見などありましたらメールを送って下さい。お待ちしています。
(E-mail:hiroko@ladys-page.com)
