次のような JCarousel の静的コンテンツがある場合:
<ul id="mycarousel" class="jcarousel-skin-tango">
<li><img src="image1.bmp" alt="" width="75" height="75" alt="" /></li>
...
<li><img src="image6.bmp" alt="" width="75" height="75" alt="" /></li>
</ul>
次に、カルーセルが 6 つの画像をスクロールします。
空のリストがある場合:
<ul id="mycarousel" class="jcarousel-skin-tango">
</ul>
アイテムを動的にロードします。
jQuery('#mycarousel').jcarousel({
itemLoadCallback: myCarouselItemLoadCallback,
});
function myCarouselItemLoadCallback(carousel, state)
{
if (state === "init")
{
for (var i = 0; i < dummyData.length; ++i)
{
carousel.add(i, dummyData[i].ihtml);
}
}
}
ここで、dummyData は次のように定義されます。
var dummyData =
[
{
ihtml: "<li><img src='image1.bmp' alt='' width='75' height='75'/></li>"
},
etc for the other 5 items
];
次に、6 つのアイテムを含むカルーセルを取得しますが、6 つが使い果たされた後、[次へ] ボタンは無効になりません。代わりに、[次へ] を永遠に押すことができます。さらに 3 つの「画像」が表示され続けます。これらはすべて単なるプレースホルダーです (don'何と呼べばいいのかわかりませんが、画像がある空のボックスです)。
私の質問は、静的コンテンツの場合のようにカルーセルが 6 で停止しないのはなぜですか?
ありがとう。