左矢印と右矢印で制御される 3 つのペインを持つカルーセルがあります。ペイン 1 で左矢印を無効にし、ペイン 3 で右矢印を無効にして、カルーセル自体がループしないようにします。
機能しているように見えるボタン無効化機能を作成しましたが、正しいペインから呼び出そうとしても機能しません。
右矢印ボタンのクリックで呼び出される、カルーセル ペインを進める JavaScript を次に示します。
if(currentPane==1){
currentPane=2;
$("#carouselDots").css('background-image', 'url(images/dots_2.png)');
}
else if(currentPane==2){
currentPane=3;
$("#carouselDots").css('background-image', 'url(images/dots_3.png)');
disableRButton();
}
これが disableRButton 関数です。
function disableRButton()
{
$("#carouselBtn").button("disable");
}
また、ボタンが無効になっているときに BG img を変更したいのですが、これは CSS でやろうとしていることです。
.carouselBtn:disabled{
background:transparent url('images/carouselArrowDisabled.png')no-repeat;}
ボタンが無効にならない理由についてのアイデアは素晴らしいでしょう。また、この無効化されたボタン タグを CSS で使用する正しい方法は何ですか、または JavaScript でボタンの BG img を変更する方が良いですか?