帰宅が1時ということで、あまり時間が取れないので、APIは週末に持ち越し。
今日は、CSS3のアニメーションで遊んでみました。
ブラウザは、もちろんSafari。
今日の参考サイトは、
こちら。
前回のCSS3のサンプル記事でも書きましたが、Safariなどwebkitをエンジンとするブラウザでは、CSS3に対応させるために、「
-webkit-」のプレフィックスをつけます。
-webkit-transition: 1s ease-in-outは、1秒で変形を完了する指定
-webkit-transform: 変形などを指定するCSS
-webkit-border-radius: 角を丸くするCSS
-webkit-rotate: 回転を指定するCSS
-webkit-skew: X軸、Y軸のゆがみ
今回作った
CSS3のサンプルです(Safariで閲覧してください)。
マウスオーバーすると動きます。
以下の図を見ての通り、激しく制御不能に陥りました^^;
HTML5関連書籍