skuare.netはJavaScriptライブラリのjQuery,mootools,prototypeのプラグインを中心にWebサイト構築に関する技術を試す個人サイトです

JavaScriptライブラリ「mootools」で3Dぐるぐるさせる

｜ ｜ ｜ ｜ ｜ ｜ ｜

最近、英語で言うところのcarousel（回転木馬）と言われる画像をぐるぐる回すのがはやっています。
これをJavaScriptライブラリ「mootools」を使用して3Dにした「Mootools 3D Carousel」を紹介します。

使用方法 Mootools 3D Carouselから3dcarousel.jsを、mootoolsからmootools.jsをダウンロードします。
<script type="text/javascript" src="http://yourdomain/mootools.js"></script>
<script type="text/javascript" src="http://yourdomain/3dcarousel.js"></script>
上記を記述したらぐるぐるさせたい画像を以下のように書けば完成です。
<div id="carousel">
<div><a href="リンク先"><img src="画像パス"></a></div>
画像分
</div>
JavaScriptライブラリ「mootools」で3Dぐるぐるさせるサンプル

記事作成：2008年10月13日

前の記事：ファイルサイズをJavaScriptライブラリ「jQuery」で自動表示する「addSizes.js」
次の記事：モバイルサイトに関するサイト19