トップ > Javascriptサンプル

Javascriptは、ブラウザの種類やバージョン、環境により機能するものとしないものがあります。
また、DHTMLを使用している場合もあります。
DHTMLについては「DHTMLサンプル」もご参照下さい。

■ スライド文字の表示

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

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

◆ 実行サンプル

略号の説明 動作が確認できたブラウザ
IE6.0 NS7.0 MZ1.7.7 FF1.5 OP7.53

【記述サンプル】

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


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



page update:2010/01/23 20:32

Copyright (c) 2000-2009, all Rights Reserved & Produced by atom