回転しながらズームイン・ズームアウトオブジェクトを回転しながらズームさせるにはCSS3のtransitionとtransformを組み合わせるだけで良い。ぐるぐるぐるぐるどっか～ん。Ch9とFx4b9、Op11、Sf5あたりなら動く。 Demo: Rotate and Zoom CSSコードはややこしくはないが、imgのリサイズをCSSでまかなったりマイナー寄りの書き方かもしれない。読みづらいのでベンダー拡張プリフィックスは省略した。実際に書く時はプロパティ名の頭に-webkit-/-moz-/-o-を付けてコピペすれば良い。 #zoom { width: 400px; height: 400px; } #zoom img { margin: 150px; border: none; display: block; width: 100px; height: 100px; transition-duration: 3s; }
