どのボタンが押されたかに応じて、どの画像がページに次に表示されるかを追跡することになっている、私が書いたコードがあります
$(document).ready(function(){
$("#moveleft").click(function(){
var negoff = "false";
$("#slideshow>ul>li").animate({left: '-=' + actualwidth + 'px'}, 500);
$("#slideshow>ul>li:first-child").remove();
offset++;
console.log("Offset: " + offset);
if(offset > 4){
offset = 0;
}
if(offset < 0){
offset = offset * -1;
negoff = true;
}
$("#slideshow>ul").append('<li><img src="images/' +
contentcategories[offset] + '.jpg"/></li>');
$("#slideshow>ul>li:last-child").css({width: picturewidth + "px",
left: + 6 * actualwidth + "px"});
if(negoff){
offset = offset * -1;
negoff = false;
}
});
$("#moveright").click(function(){
var posoff = "false";
$("#slideshow>ul>li").animate({left: '+=' + actualwidth + 'px'}, 500);
$("#slideshow>ul>li:last-child").remove();
offset--;
console.log("Offset: " + offset);
if(offset < -4){
offset = 0;
console.log("Offset: " + offset);
}
if(offset > 0){
offset = offset * -1;
posoff=true;
console.log("Posoff: " + posoff);
}
$("#slideshow>ul").prepend('<li><img src="images/' +
contentcategories[(contentnum - 1) + offset] + '.jpg"/></li>');
$("#slideshow>ul>li:first-child").css({width: picturewidth + "px",
left: + 0 + "px"});
if(posoff){
offset = offset * -1;
posoff = false;
}
});
});
これについて紛らわしいのは、#moverright ボタンを 2 回続けてクリックすると、オフセットが -1 になり、次に 0 になり、2 つの値をループし続けることです。#moveleft ボタンでもほぼ同じことが起こります。値 0 と 1 を循環します。
オフセット変数を0に設定する唯一の場所は、4を超えるか-4を下回る場合であり、2または-2になった後に0に設定する理由が見当たらないため、私はこれに混乱しています.