私のウェブサイトにあるスライドショーに合わせてサムネイルのフィルムストリップを作成しようとしています。スライドショーの画像が変わるたびに左に移動するはずです。一番左のものは幅 0px に縮小されます。右側から新しいものが出現します。ただし、現在、画像は問題なく左に移動しますが、循環はせず、単にページから移動し続けます。新しいものは行末に表示されます。私が現在持っているコードは
function slideImage() {
var $pic1 = $('#pic1');
var $pic8 = $('#pic8');
if (i <= numImages - 8) {
name8 = name1 + getString(i + 7) + name2;
}
else if (i <= numImages) {
name8 = name1 + getString((i - numImages) + 7) + name2;
}
else {
i = 1;
name8 = name1 + getString(i + 8) + name2;
}
$pic1.animate({ width: "0px", padding: "0px" }, 1000, function () {
$pic1.attr("id", "pic8")
.attr("src", name8);
});
$pic8.animate({ width: "75px", padding: "5px"}, 1000, function () {
$("#pic2").attr("id", "pic1");
$("#pic3").attr("id", "pic2");
$("#pic4").attr("id", "pic3");
$("#pic5").attr("id", "pic4");
$("#pic6").attr("id", "pic5");
$("#pic7").attr("id", "pic6");
$pic8.attr("id", "pic7");
});
$(".im").not("#pic8").animate({ left: "-=85px" }, 1000);
}
実際のスライドショーで画像を変更する関数を呼び出すたびに、この関数を呼び出します。pic1 から pic8 までの ID を持つ画像のリストがあり、すべて div 内に絶対配置されています。画像のソースは ..\photos\pic_.jpg で、_ は 1 からフォルダー内の画像数までの 3 桁の数字に置き換えられます。私はjavascriptとjqueryに本当に慣れていないので、助けていただければ幸いです! ありがとう!