要素を回転表示させるJavaScript「jQuery Carousel」

amazonなどでは、書籍を回転表示させ一覧性と省スペースを兼ね備えています。
jQuery Carouselを使用することで、似たよう表示が可能です。
要素を回転表示させるJavaScript「jQuery Carousel」サンプル

使用方法
jQuery Carouselからjquery.carousel.jsを、jQueryからjquery.jsをjQuery Easing Pluginからjquery.easing.jsをダウロードします。
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.carousel.js"></script>
<script type="text/javascript" src="jquery.easing1.3.js"></script>
<script type="text/javascript" language="JavaScript">
$(function(){
$("div.要素名").carousel();
});
</script>

あとは上記で記述した要素にulで記述すれば出来上がりです。
<div class="div要素名">
<ul>
<li>回転要素1</li>
<li>回転要素2</li>
<li>回転要素3</li>
</ul>
</div>

そのほかのオプションは以下のサンプルの通りです。
要素を回転表示させるJavaScript「jQuery Carousel」サンプル

sponsors

「要素を回転表示させるJavaScript「jQuery Carousel」」をシェアする

記事作成:
記事URL:

TOP > > > 要素を回転表示させるJavaScript「jQuery Carousel」