■ スライド文字のフェードアウト

文字をスライドさせながら自動表示後、フェードアウトします。
電光掲示板のような表示が可能です。

文字数や文字行数に制限はありません。
すべて自動認識します。

◆ 実行サンプル

【記述サンプル】

まず、テキストエディタなどを使用し、次の記述を「slidtxt0.js」というファイル名で保存します。
var txt = new Array(); txt[0]="　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　"; txt[1]="ようこそ【超初心者のホームページ作成】へ"; txt[2]="ここには様々なサンプルがあります。"; txt[3]="使えそうなものがあったらどんどん使用してください。"; mmax = 3; //メッセージ行数 ispeed = 0; //表示スピード ospeed = 10; //消去スピード ddelay = 2000; //表示時間（ミリ秒） hdelay = 1000; //非表示時間（ミリ秒） wdelay = 2000; //待機時間（ミリ秒） slide_set(); function slide_set(){ midx = 1; strcnt0 = 0; setTimeout("slide_in()", 0); } function slide_in(){ document.frm1.txt1.style.color = 0; txt0 = txt[0] + txt[midx]; txt0 = txt0.substr(strcnt0++); document.frm1.txt1.value = txt0; if (strcnt0 >= txt[0].length+1) { strcnt0 = 0; setTimeout("fade_out()", ddelay); }else{ setTimeout("slide_in()", ispeed); } } function fade_out() { document.frm1.txt1.value = txt[midx]; document.frm1.txt1.style.color = 0x111111 * strcnt0++; if (strcnt0 >= 15) { midx++;if (midx > mmax) { midx = 1; } strcnt0 = 0; if (midx == 1) { setTimeout("slide_in()", wdelay); }else{ setTimeout("slide_in()", hdelay); } }else{ setTimeout("fade_out()", ospeed); } }

そして表示用のフォームとJavascriptの呼び出しを次のように記述します。 <form name="frm1" align="center"> <input type="text" name="txt1" size="60"> </form> <script type="text/javascript" src="./js/slidtxt1.js"></script>