html+time samples


  1. 最もシンプルなHTML+TIMEサンプル1(BEGIN属性とDUR属性)
  2. 最もシンプルなHTML+TIMEサンプル2(BEGIN属性とDUR属性)
  3. 最もシンプルなHTML+TIMEサンプル3(timeaction属性がdisplay)
  4. 最もシンプルなHTML+TIMEサンプル4(timeaction属性がnone)
  5. 最もシンプルなHTML+TIMEサンプル5(timeaction属性がvisibility)
  6. 最もシンプルなHTML+TIMEサンプル6(timeaction属性がstyle)
  7. 最もシンプルなHTML+TIMEサンプル7(timeaction属性がstyle)
  8. 覚書:timeaction属性のデフォルト
  9. timeaction="style"で色を順番に変えてみる1
  10. timeaction="style"で色を順番に変えてみる2
  11. timeaction="style"で色を順番に変えてみる3
  12. timeaction="style"で色を順番に変えてみる4
  13. timeaction="style"で色を順番に変えてみる5
  14. timeaction="display"で色を順番に変えてみる
  15. end属性の使い方
  16. end属性で実現するクリックすると消える文字
  17. end属性とbegin属性で実現するクリックすると表示/非表示が切り替わる文字
  18. end属性とbegin属性で実現するクリックするとスタイル指定が切り替わる文字1
  19. end属性とbegin属性で実現するクリックするとスタイル指定が切り替わる文字2
  20. end属性とbegin属性でマウスが乗ったらスタイルの変わる文字を作る(mouseoutとmouseover)
  21. end属性とbegin属性でマウスが乗ったらスタイルの変わる文字を作る(練習1)
  22. end属性とbegin属性でマウスが乗ったらスタイルの変わる文字を作る(練習2)
  23. 覚書:HTML+TIMEソースひな形
  24. 繰り返し表示1
  25. 繰り返し表示2
  26. timecontainer属性(seq)1
  27. timecontainer属性(seq)2(repeatCountを追加)
  28. <t:seqタグ>でNo.27と同じことを実現
  29. timecontainer属性(par)1
  30. timecontainer属性(par)2(repeatCountを追加)
  31. <t:parタグ>でNo.30と同じことを実現
  32. timecontainer属性(excl)1
  33. timecontainer属性(excl)2(repeatCountを追加)
  34. <t:excl>タグでNo.33と同じことを実現
  35. <t:animate>によるHTML+TIME Animationの基本1
  36. <t:animate>によるHTML+TIME Animationの基本2
  37. <t:animate>によるHTML+TIME Animationの基本3(fill="hold")
  38. <t:animate>によるHTML+TIME Animationの基本4(repeatCountによる繰り返し)
  39. <t:animate>によるHTML+TIME Animationの基本5(autoReverse="true")
  40. <t:animate>によるアニメーションの練習1(横に動かす)
  41. <t:animate>によるアニメーションの練習2(縦に動かす)
  42. <t:animate>によるアニメーションの練習3(文字を順番に落下させる)
  43. <t:animate>によるアニメーションの練習4(mouseoverとmouseout)
  44. <t:animate>によるアニメーションの練習5
  45. <t:animate>によるアニメーションの練習6(ボーダー線サイズを変化させる)
  46. <t:animate>によるアニメーションの練習7(文字サイズを変化させる)
  47. <t:animate>によるアニメーションの練習8(画像を動かす)
  48. <t:animate>によるアニメーションの練習9(画像のサイズを変える)
  49. <t:animate>によるアニメーションの練習10(画像のサイズを変える)
  50. <t:animateColor>によるHTML+TIME Animationの基本1
  51. <t:animateColor>によるHTML+TIME Animationの基本2
  52. <t:animateColor>によるHTML+TIME Animationの基本3(ボーダーの色を変える)
  53. <t:animateColor>によるアニメーションの練習1(本文色を変える)
  54. <t:animateColor>によるアニメーションの練習2(点滅するリンクボタン)
  55. <t:animateColor>によるアニメーションの練習3(グラデもOK)
  56. <t:animateColor>によるアニメーションの練習4(グラデもOK 2)
  57. <t:animateColor>によるアニメーションの練習5(点滅メニュー)
  58. <t:animateMotion>によるHTML+TIME Animationの基本1
  59. <t:animateMotion>によるHTML+TIME Animationの基本2(VALUE属性)
  60. <t:animateMotion>によるHTML+TIME Animationの基本3(PATH属性)簡易動作チェック
  61. <t:animateMotion>によるアニメーションの練習1(画像を動かす)
  62. <t:animateMotion>によるアニメーションの練習2(文字を動かす1)
  63. <t:animateMotion>によるアニメーションの練習3(文字を動かす2)
  64. <t:animateMotion>によるアニメーションの練習4(複数のdivを同時に動かす)
  65. <t:animateMotion>によるアニメーションの練習5(ボタン落下)
  66. <t:animateMotion>によるアニメーションの練習6(valuesでボタンを動かす)
  67. プロパティを設定する<t:set>タグの基本1
  68. プロパティを設定する<t:set>タグの基本2(各プロパティを2秒間だけ設定)
  69. <t:animateColorのvalues属性で背景色と文字色を変化させる
  70. 変化する数値の幅を指定するby属性
  71. <t: 〜>タグを動かしたい要素の内側に書くとその要素が動く
  72. keyTimes属性とkeySplines属性(動作テスト付き)
  73. 時間の進み方を%で指定するspeed属性
  74. 加速を制御するaccelerate属性(動作テスト付き)
  75. 減速を制御するdecelerate属性(動作テスト付き)
  76. accelerate属性とdecelerate属性は足して1を超えてはいけない(動作テスト付き)
  77. リスタートの条件を設定するrestart属性
  78. 繰り返しの値を累積するaccumualate属性
  79. calcmode属性
  80. <t:animateMotionの動作の原点を指定するorigin属性
  81. HTML+TIMEを使ったダイナミックなメニュー1
  82. HTML+TIMEを使ったダイナミックなメニュー2
  83. HTML+TIMEで作ったマウスカーソルを追いかける画像1
  84. HTML+TIMEで作ったマウスカーソルを追いかける画像2
  85. beginElement(),endElement(),pauseElement(),resumeElement(),resetElement()
  86. onbegin,onend,onpause,onresume,onreset
  87. HTML+TIMEを使ったランダム背景色変更
  88. <t:transitionfilter>の基本
  89. <t:transitionfilter>のmode属性
  90. <t:transitionfilter>のmode属性のin/outを使って表示/非表示を繰り返す
  91. 複数のトランジションは同時に利用できる
  92. 1つのWeb要素には1つのHTML+TIMEの要素だけを対応させられる(正常に動かない)
  93. 1つのWeb要素には1つのHTML+TIMEの要素だけを対応させられる(正常に動く)
  94. 星を降らせる
  95. スクリプトで書き出したHTML+TIMEのコードが動作するかどうかの実験
  96. <t:transitionfilter>のtype="fade"の例
  97. スクリプトを使って動作を繰り返す
  98. スクリプトを使って動作を繰り返す2
  99. divをクリックしたY位置(縦方向の位置)までスムーズに動かす
  100. <t:animateMotion>を使ったアニメーションの例
  101. サンプル35番の<t:animate>の動作をスクリプトで繰り返す

2004年06月22日