Act10．テキストボックスを極めてみる

　今度はちっと物体を置いてみましょうか(ぉ
　・・・テキストボックスをくっつけてみましょ。まぁ応用例として、ホームページの更新履歴を書いてる人は多いですな。
　んでは、ためしにコレ。

　一見どこにでもあるようなテキストボックスですな。ソースはこれ。　

<FORM>
<TEXTAREA rows="5" cols="45">
　　　●Ｐ氏の華麗なる(違)日々●

１日目。ぼ〜っとしてみた。
２日目。とりあえず寝っ転がってみた。
３日目。うつぶせになるもくちばしがジャマ。
４日目。たいそうしてみた。体が重い・・・
５日目。ギターを見つけたのでシャウトしてみる。
６日目。今度は弾き語りしてみた。ペンギンにもできそうだ。
７日目。調子にのってRock'n Rollして見事に腰を痛めた(ぉ
</TEXTAREA>
</FORM>

　ボックス自体の大きさを変えたい場合は赤い部分の数字を変えてみましょう。
　rowsはタテの大きさ・colsは横の大きさです。

　で、ちっとステップアップ。こんなのもできます。

　ちっと色つけてみましたょ。たとえばホームページをちっと華やかにしたいのぅ・・って思った時にオススメデス。
　やり方次第でカッコよくもかわいくも恐ろしくもできますな（コラ）。
　ただし、これはＩｎｔｅｒｎｅｔ　Ｅｘｐｌｏｒｅｒ（ＩＥ）のみ色が変わります。Ｎｅｔｓｃａｐｅ　Ｎａｖｉｇａｏｒ（ＮＮ）では変化はありません。
　で、ソースはコレ。

<FORM>
<TEXTAREA rows="5" cols="45" style="color:#daa520; font-size:9pt; background-color:#ffe4b5">
　　　●Ｐ氏の華麗なる(違)日々おかわり●

８日目。散歩に出てみる。
９日目。何か見つけた。
10日目。よくわからないけど何か幸せ。
11日目。でもなつかしい気がして物思いにふけってみる。
12日目。何だかタイムスリップした気分。
13日目。このキモチなんだろう？
14日目。それがどこかに置き忘れたなつかしい思い出たちだと気づく。
</TEXTAREA>
</FORM>

　これもまた赤い部分をいぢくりまわして好きなように変えてしまいましょうか。
　まぁ、上のソースにちっと付け足ししただけなんだけどね・・・
　ｒｏｗｓはタテの大きさ・ｃｏｌｓは横の大きさ。これは上のと一緒ですな。
　これに加えてその後ろの部分（ｓｔｙｌｅ＝の部分ですな）をいぢって色の指定をします。
　ｃｏｌｏｒは文字の色・ｆｏｎｔ−ｓｉｚｅは文字の大きさ（数字だけいぢりませぅ）・ｂａｃｋｇｒｏｕｎｄーｃｏｌｏｒは背景色です。
　色はＲＲＧＧＢＢ方式で指定するといとヨロシ（←日本語ヘタ(爆)）。
　＃で始まる指定方法ですな・・・＃○♂★※♪♀・・・こんな感じ・・・何か伏せ字みたいてやらしい・・・（コラ）
　上の場合は文字色は『＃ｄａａ５２０』・背景を『＃ｆｆｅ４ｂ５』で指定してます。ちなみに、ｄａａ５２０はｇｏｌｄｅｎｒｏｄ・ｆｆｅ４ｂ５はｍｏｃｃａｓｉｎという色の名前がアリマス。だからどーしたと言われればそれまでですね、ハイ(爆)。
　ちなみに、ＲＲＧＧＢＢコードが分からなくてもＹａｈｏｏ！あたりで『＃ＲＲＧＧＢＢ方式』・・などと検索すればいくらでもコード表は出てきます。ありがたいですな♪

　そして、もぅひと工夫。こんなのはどでしょ？

　今度は文字が出てきましたね、下からずんずんと。
　あぁ、何が出てくるのか不安だけどちょっとどきどきで甘酸っぱくて切なくて・・・何言ってんだわし(爆)。
　・・・ソースはこれです(^-^;・・・

ソースそにょ１
<FORM name="auto">
<TEXTAREA name="automes" rows="5" cols="45" wrap="physical">
</TEXTAREA>
</FORM>

　これはテキストボックスを表示させるためのコードです。これをＢＯＤＹ区間内の表示させたい所に貼りましょうか。
　赤い部分でタテヨコの大きさを変えるのはもぅ説明不要ですな。

　で、次にコレ。

ソースそにょ２
<SCRIPT LANGUAGE="JavaScript">
<!--
br = unescape("%0A");
s = navigator.appVersion.charAt(5).toUpperCase();
if(s=="M") br = unescape("%0D");
if(s=="W") br = unescape("%0D")+br;
num = 19;
stf = new Array(num);
stf[0]=br;stf[1]=br;stf[2]=br;stf[3]=br;stf[4]=br;stf[5]=br;
stf[6]="Ｐ氏の華麗なる(違)日々再び"+br;
stf[7]="15日目。ネコと遊ぶ。"+br;
stf[8]="16日目。ネコとじゃれる。"+br;
stf[9]="17日目。ネコとひなたぼっこする。"+br;
stf[10]="18日目。ネコとだらだしてみる。"+br;
stf[11]="19日目。ネコと寝る。"+br;
stf[12]="20日目。ネコとごはんを食べる。"+br;
stf[13]="21日目。そして改めて自分はペンギンでよかったと気づく。"+br;
stf[14]=br;stf[15]=br;stf[16]=br;stf[17]=br;stf[18]=br;
cnt = 0;
timeID = 10;
function roll(){
str = "";
for (i=0; i<5; i++) str += stf[i+cnt];
document.auto.automes.value = str;
cnt++;
if (cnt>=num-5) cnt=0;
clearTimeout(timeID);
timeID = setTimeout('roll()',1000);
}
//-->
</SCRIPT>

　実際の内容の部分ですな。これはアタマのＨＥＡＤ区間の中に貼り付けてください。日本語の部分はご自由に。
　スクロールのスピードは下から４行目の赤い部分。この数字を変えてスピード調整しませぅ。数字が大きくなる程遅くなります。

　で、最後にコレ。

ソースそにょ３
onload="roll()"

　このソースはＢＯＤＹタグの中に埋めてください。こんな感じですな。
　<BODY onload="roll()">

テキストボックスは使い方次第でホームページのアクセントにもジャマな物体にもなると思われますな（おりっぺ理論(爆)）。
アイデアとセンスでイカした使い方してみてくださいね(笑)。