Java Script/DHTML 事例集 Valid HTML 4.01!



ホームページ作りもだんだんと凝りはじめ、アニメーションGIFでは出来ないことをJavaScriptを使ってやってみようとトップページ作りを始めました。 ここには今までに作ったJava Script/DHTML(ダイナミックHTML)を用いた始めのタイトル画面の事例・サンプルとしてまとめてあります。
2週間に1度のペースで新しいものを考えていきたいと思っていますがいつまで続けられるか・・・
各ページにポイントは記述しましたが、詳細はソースをご覧下さい。
(クロスブラウザを心がけていますが、Operaだけはレイヤのクリップ表示機能が無いためほとんどの事例でうまく動きません。 Internet Explorer,Netscape 4,Netscape 6では動くはずです。)
項番 項目 掲載日 概要
46 ルーレット 2003.5.11 コインを賭けて遊んで見てください。
45 めくり絵 2003.3.16 4隅から絵をめくると裏面が透けながら次の絵に。
44 ドット文字表示 2003.2.23 入力した文字列をドット文字で各種表示します。
43 シュプール 2003.1.25 少しはスキーに行った気分になるでしょうか?
42 射的 2002.12.31 お正月に干支の射的をどうぞ
41 クリスマス 2002.12.08 サンタクロースの乗ったソリが走るクリスマスカード
40 カレンダー 2002.11.21 希望の年月のカレンダを表示します。ご自分の生まれた日の曜日は?
39 風船 2002.10.27 ゆらゆら揺れながら上昇する風船を割って見てください。
38 足跡 2002.09.29 変なペンギンが足跡を残して動きまわります。
37 いじわるボタン 2002.09.09 チョット意地悪なボタンです。
36 2002.08.24 夜空に稲妻、閃光が走ります。
35 いるか 2002.07.28 いるかが波立つ海面をジャンプしていきます。
34 虫眼鏡 2002.06.30 マウスで虫眼鏡を移動させると画像が5倍に拡大表示されます。
33 パノラマ 2002.05.25 360度の景色の希望の場所が表示されます。
32 車窓から 2002.04.21 列車の窓から見える景色を表示してみました。
31 文字拡大表示 2002.03.24 小さい文字の文字列が順に大きな文字に変わるサイン表示です。
30 虹サイン 2002.03.03 文字の色が虹色に流れるサイン表示です。
29 跳ねるボール 2002.02.11 落下し、跳ね返るボールのシミュレーションです。
28 画像切り替え 2002.01.20 スライドショウのように色々なパターンで画像を切り替えます。
27 砂時計 2002.01.06 砂時計が落ちきると何が起こるか。砂時計の反転もできます。
26 床屋さんサイン 2001.12.23 床屋さんのサインのように枠の棒が回転してみえます。
25 フライイング果物 2001.12.08 Windowsのスクリーンセーバのフライイングウィンドウもどきです。
24 タイプライタ 2001.11.25 タイプライタが指定の文字列を紙に印字する動作を模擬表示します。
23 レントゲン 2001.10.28 画面表示されているものを、マウスで動くカメラが透過写真表示します。
22 落ち葉 2001.10.12 画面上をゆらゆら落ち葉が落下します。風を吹かすと落ち葉も飛びます。
21 パイプ 2001.09.24 Windowsのスクリーンセイバーのようにパイプを描く。(ただし二次元です)
20 プラネタリウム 2001.09.08 5項での失敗作にレイヤを使って再挑戦。時々刻々星空が変化します。昼間見えない星も見れる星座早見です。星の名前も見れます。
19 鳩時計 2001.08.27 鳩が時刻と同じ回数顔を出すアナログ鳩時計。
18 玉突き振り子 2001.08.17 理科の実験でお馴染の玉突きの振り子です。
17 花火 2001.08.07 色々な色の花火がランダムに打ち上げられます。
16 海を泳ぐ魚 2001.07.28 左右からランダムに色々な魚が泳いできます。
15 紙芝居 2001.07.08 Home Pageの紹介を紙芝居風に表示します。
14 スライド表示 2001.06.09 歓迎メッセージが画面端からすべるように出てきます。
13 幕開け 2001.05.20 舞台の幕が開くと中にご挨拶が現れます。幕の開閉ボタンもあります。
12 回転文字サイン 2001.05.06 18文字が回転するサインです。各文字の色も1回転毎に変わります。
11 神経衰弱 2001.04.21 枚数は少ないですが、トランプの神経衰弱の一人ゲームです。
10 カレンダー 2001.04.07 今月のカレンダーを自動作成し、今日の位置を表示します。
9 スロットマシーン 2001.03.25 3桁の数字のスロットマシーンです。幾つの数字が一致したかも判定します。
8 音声による挨拶 2001.03.11 アクセスされた時刻により挨拶の音声と文字が変わります。(多少時間が掛かります。)
7 回転ネオンサイン 2001.02.25 二つのボールが異なる色で異なるスピードでぐるぐる回ります。
6 現在日時をリアルタイム表示 2001.02.10 現在の日時をリアルタイム表示。曜日により月日の文字色を、時刻により時刻の文字色が変化。
5 プラネタリウム 2001.02.10 現在の星空を表示し、以降5秒ごとに1時間後の星空を順に表示する。指定時刻の星空も表示できる。表示中の星をクリックすると名前を表示する。
表示に大変時間が掛かります。(特にNetscapeの場合)
4 毎回背景画を変える 2001.01.30 ロードされるたびに背景画を変えて見ます。
3 雪が降ったり溶けたり 2001.01.27 雪が降りはじめ、だんだんと強くなり積もっていきます。やがて止み、太陽が出 雪を溶かします。
2 蛇たたき 2001.01.15 蛇のもぐらたたきです。穴からランダムに出てくる蛇をクリックしてください。
1 背伸びする蛇 2001.01.02 10匹の蛇がランダムに背伸びし、元に戻ります。
ここに載せた事例を応用して個人のページで使用されるのは改変を含めて自由ですが、転載・雑誌その他への公表/引用をされる時は必ず原作者名を併記下さい。

お勧めサイト

ここのページを作るのにも大変参考になっているお勧めサイトです。
YoochanさんのDecoration HTML Room

鴈野さんちのHomePage TOPへ
ご感想などは鴈野 敏生 まで。