[JS]さまざまな要素をダイナミックなアニメーションでズームさせるスクリプト -Zoomooz
Post on:2011年9月14日
sponsors
画像だけでなく、ページ内のさまざまな要素をダイナミックなアニメーションでズームイン・アウト、回転させるjQueryのプラグインを紹介します。
[ad#ad-2]
スクリプトの動きは、ページ内の最も目立つ赤いパネルをクリックしてみてください。
赤いパネルの傾きが正位置になるよう回転し、ページ全体がダイナミックにアニメーションでズームします。
Zoomoozのデモ
Zoomoozを使った面白いデモが多数公開されています。
アイソメトリック キューブ
3Dのキューブで、3面のどれかをクリックするとズームします。
3Dのキューブで、3面のどれかをクリックするとズームします。
ちらっと見えてる他の面をクリックすると回転します。
面にある4つのパネルをクリックすると、更にズームします。
画像ギャラリー
Flickrから呼び出した画像を重ねて表示しています。
重なっている画像をクリックすると、それを中心にズームします。
Zoomoozの基本的な動きが分かるデモ
さまざまな形状の要素が配置されており、それぞれをクリックするとアニメーションで正位置に回転されズームします。
[ad#ad-2]
Zoomoozの対応ブラウザ
Zoomoozの対応ブラウザは下記の通りです。
- IE9
- Firefox3.6+
- Safari3+
- Chrome
- Opera
Zoomoozの実装
Zoomoozをページに実装するには、外部ファイルを指定します。
