先日リリースされたSafari3.1は「CSS transforms and transition」を正式にサポートしています。 なんでもCSSでアニメーションを設定できちゃうとか。 ソレは面白い!てコトでさっそく試してみました。 (Safari 3.1で閲覧ください) 静的な表示を制御 まずは各要素のスタイルを静的に設定してみます。 共通の設定はこんな感じです。 <style type="text/css"> .box { width: 100px; height: 60px; margin: 0 auto 50px; background: #555; color: #FFF; text-align: center; border: 2px solid #999; } </style>