| ポイント |
<![CDATA[
c = str.charAt(count++);
document.all["strID"].style.color = "#"+c+c+c+c+c+c;
if (count < str.length) setTimeout("strFade('" + str + "')",250);
<body onLoad="strFade('fedcba9876543210')" bgcolor="white">
<span id="strID" style="color:white">
]]>
|
| 説 明 |
文字をフェードイン／アウトさせるにはスタイルシートを使って文字色を変化させます。変化させる文字はspanタグなど何かのタグで囲んでおき、id名を付けておきます。「document.all[ID名].style.color」に色コードまたは色の名前を書き込むと文字色を変えることができます。フェードさせるには、色コードを変化させますが、色コードを算出するのに"fedcba9876543210"の文字列から１文字抜き出して連結しスタイルに適用します。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>文字をフェードイン／フェードアウトする</title>
<script Language="JavaScript"><!--
count = 0;
function strFade(str)
{
c = str.charAt(count++);
document.all["strID"].style.color = "#"+c+c+c+c+c+c;
if (count < str.length) setTimeout("strFade('" + str + "')",250);
}
// --></script>
</head>
<body onLoad="strFade('fedcba9876543210')" bgcolor="white">
横の<span id="strID" style="color:white">文字をフェードイン</span>させます。
</body>
</html>
]]>
|
| 補足説明 |
なし |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
文字をフェードイン／フェードアウトする