今回は文字をフェードイン・フェードアウトさせる効果です。
文字をフェードイン・フェードアウトさせる
| 今回の効果は、何も表示されていないところに段々文字を浮かび上がらせる、あるいは表示されている文字を段々消えていくようにするものです。勿論、アニメーション画像は使っていません。 ＩＥ用とＮＮ用では少し書き方が違うので、今回の実験はＩＥ用とＮＮ用と別々にしてみました。 別々に書かなければならないのでＨＰを２つ用意しなければなりませんが、動きのある表示ができるので、ちょっといい感じのもができあがります。 今月も少しだけこの実験にお付き合い下さい。 |
 ポイント | ＩＥではDIVを、ＮＮではLAYERを使用します。 文字の色を１６進数で表し、c+c+c+c+c+c に入れる値を var cFade = "0123456789abcdef" で、0からfまでどんどん順番に換えていくことで色が変化します。0123456789abcdef でフェードアウト、fedcba9876543210 でフェードインします（ＩＥ・ＮＮともに同じ）。 setTimeout で、浮き上がる、あるいは消えていくスピードを指定します。 |
 効果 | 文字の色が、指定された順番で c+c+c+c+c+c の中に入っていき、色が変わることで効果がでます。 |
 使い方 | 実際の実験画面のソースをご覧下さい。 |
今回の実験でわかったこと
| この効果は、Ｎｅｔｓｃａｐｅ４．０、Ｅｘｐｌｏｒｅｒの４．０以上でできます。 ただ、書き方が違うのでソースを別々に用意しました。もし、１つで済む書き方をご存じの方がいたらぜひ教えてください。 しくみとしては簡単です。文字の色をどんどん入れ換えて表示させているだけなのです。白いバックの上に白い文字を表示させておくと、そこには何もないように見えます。色を濃くしていくと段々はっきりしてきて浮かび上がってくるように見えます。 スピードも自分で調節できます。 気が向いたらお試し下さい。 |
ご意見などありましたらメールを送って下さい。お待ちしています。
(E-mail:hiroko@ladys-page.com)
