★ベンダープレフィックスは付けてないので最新のブラウザでご覧ください。また、本文よりも余分な効果がついているものもあります。
Sample下の長方形にマウスの乗せると矩形が変化します。
下の文字にマウスの乗せると背景が変化します。
jQuery を使ってクリックでアニメーション。下の長方形をクリックすると、変形します。
CSS3だけでクリックでアニメーション。下の長方形をクリックすると、動きます。
:active で指定。下の円を押し続けると大きくなります。
input:focus
枠内でクリックした位置にボールが移動します。
アニメーションサンプル１
アニメーションサンプル 1_2 :hover に指定
アニメーションサンプル３ 複数のプロパティの値の変更
アニメーションサンプル３ 繰り返し（5回）
アニメーションサンプル4 複数キーフレーム
アニメーションサンプル5 ホバーで再生・一時停止
アニメーションサンプル6（遅延：５秒）ディレイ中と再生後の表示（標準） animation-fill-mode:none
アニメーションサンプル5（遅延：５秒）ディレイ中の表示 animation-fill-mode:backwards
アニメーションサンプル6_3（遅延：５秒）再生後の表示 animation-fill-mode:forwards
アニメーションサンプル6_4（遅延：５秒）ディレイ中と再生後の表示 animation-fill-mode:both