DHTML応用のトップページです。
テキスト入力した文字も表示できます。
【JavaScript/DHTMLのポイント】

文字拡大表示


  1. ロード時にブラウザの種類の判定後、IniSet()関数が画面サイズの取得をした後、初期設定をします。
    その後始めの歓迎文字列をまず小さい文字列で表示後、歓迎文字列の1行目をOtxtに設定後タイマでEnlarge()関数を呼び出します。
  2. 歓迎文字列の１行目は大きい文字をレイヤL[1]に、中くらい文字列をレイヤL[2]に、小さい文字列をレイヤL[3]に表示し、 ２行目はそれぞれL[4],L[5],L[6]に、入力された文字列はL[7],L[8],L[9]に表示されます。
  3. それぞれの文字列はWriteHTML()関数で指定のレイヤに指定の文字列を書き込んでいます。IE,NS6ではそれぞれのレイヤでFont-sizeがstyleで指定されていますが、 NS4ではできないため<FONT>タグを書き込んで文字の大きさを変えています。
  4. Enlarge()関数ではstepごとにOtxtを三つに分解しOtxt文字列からまづ先頭の１文字を中くらいの文字で表示し、以降の文字列を小さい文字列で表示すると同時に、 中くらいの文字列に続けて小さい文字列が表示されるよう位置も移動します。
    次のステップでは1文字目を大きい文字で表示し、2文字目を中くらいの文字で表示し、残りの文字列を小さい文字列で表示し、場所も移動します。
    次のステップでは2文字目までを大きい文字で表示したまま、3文字目のみを中くらいの文字で表示し、残りの4文字目以降の文字列を小さい文字列で表示し、場所も移動します。
    これを繰り返しOtxt文字列全てを大きい文字列で表示したら、Otxt文字列に歓迎文字列の2行目を設定し、処理レイヤNOもL[4]〜L[6]に切り替えます。
    ２行目も終了したら終わりでボタン入力があるまで何もしません
  5. text boxに文字列が入力されて「表示」ボタンがおされるとType()関数がよばれ、text boxの文字列がOtxtに設定され、表示レイヤをL[7]〜L[9]にして歓迎文字列と同じように順に大きく表示します。
  6. 「始めから」ボタンを押されたとき、画面サイズを変更したときはlocation.reload()関数で最初からやり直します。
それにしてもNS4で文字の大きさを変えるDHTMLは思ったように動作してくれません。
Java Script事例集トップページへ
鴈野さんちのHomePage TOPへ
ご感想などは鴈野 敏生 まで。