前の記事では hover や active などマウスイベントでのアニメーションだったので、オンロード時にCSS3のアニメーション実行方法を記します。 サンプルまずアニメーション動作を記述する。 今回はオンロード時にフワッとフェードインさせる内容。 @-webkit-keyframes fadeIn { 0% { filter: alpha(opacity=0); -moz-opacity:0; opacity:0; } 100% { filter: alpha(opacity=100); -moz-opacity:1; opacity:1; } } 「@-webkit-keyframes」に続き「fadeIn」という名前で定義しています。 JavaScriptのfunctionによる関数定義と同じ。 その中で0%~100%によるスタイルの状況を記述する。 色や透明度だけでなく拡大縮小・回