[JS]よく使う機能だけに絞り込んだ、シンプルなカルーセルのスクリプト -bxCarousel

Post on:2010年9月6日

sponsors

画像をはじめさまざまなHTML要素をスライド表示させるカルーセルのスクリプトを紹介します。

下記のデモでは、Example One（表示数4、移動数2、手動操作）、Example Two（表示数3、移動数1、自動操作）となっています。

カルーセルの実装はシンプルなリスト要素です。

リスト内には画像・テキストなど、さまざまなHTML要素を配置できます。

&lt;ul&gt;
	&lt;li&gt;first&lt;/li&gt;
	&lt;li&gt;second&lt;/li&gt;
	&lt;li&gt;third&lt;/li&gt;
	&lt;li&gt;fourth&lt;/li&gt;
&lt;/ul&gt;

<ul>

<li>first</li>

<li>second</li>

<li>third</li>

<li>fourth</li>

</ul>

スクリプトのオプションでは下記の項目を設定できます。