试试这个...我还在这个 pastebin中发布了一个演示。
var newScrollX = $(this).nextAll(".instOf"+myNo+":first");
假设这$(this)是当前选定的对象。
更新：
请原谅我冒昧并清理您的代码，我的强迫症迫使我这样做！以下是一些注意事项：
- 我链接了多个功能并根据需要使用
.end()（链接）。
- 无需
eval()在代码中使用。
我替换了.prevAll().length代码的一部分，因为 ID 包含当前长度。
.substring(2,newScrollX.length); // im4 -> 4
我将滚动更新合并为链接和图像点击都使用的一个功能。
- 我删除了所有评论和未使用的变量。抱歉，如果我删除了您正在处理的其他内容。
当前图像显示已修改。我使用当前 ID 和模数运算符来计算图像编号 - 它的编码更少：P
cImDis = ((cIm-1) % totIm) + 1;
脚本
var edge, marginLeft;
var cIm = 1; // make this global
$(document).ready(function(){
edge = $("#navDiv").offset();
marginLeft = edge.left;
$('#projectImages')
.css("background-position",marginLeft+"px 10px")
.children("li").each(function(i){
$(this).css('opacity', 0.0);
})
$("div.personInfo")
.children(".toShow").hide().end()
.each(function(i){
$(this).click(function(){
var tgt = $("#xxx"+(i+1));
if($("#xxx"+(i+1)).is(":visible")){
$("#xxx"+(i+1)).slideUp(150);
} else {
$("#xxx"+(i+1)).slideDown(200);
}
});
});
})
$(window).resize(function(){
edge = $("#navDiv").offset();
marginLeft = edge.left;
})
$(window).load(function(){
cIm =1;
var cImDis =1;
var totIm = parseInt($("#totIm").text(),10);
var totX = 0;
edge = $("#navDiv").offset();
marginLeft = edge.left;
var imageIcons="";
$('#projectImages')
.css("background-position","-1000px 20px")
.children("li:eq(0)").animate({
opacity: 1.0
}, 400 ).end()
.children("li").each(function(i){
if(i>0){
totX = 0;
$(this).parent("ul").children("li:lt("+i+")").each(function(){
totX += $(this).width();
});
$(this).css("left",(totX+marginLeft)+"px");
totX += $(this).width();
$(this).animate({
opacity: 1.0
}, 400 );
} else {
$(this).css("left",marginLeft+"px");
}
imageIcons +="<a class=\"scrollTo\" href=\"#\" rel='im"+(i+1)+"'> • </a>";
});
$("#imageIcons").html(imageIcons);
$("#imageIcons a:eq(0)").addClass("activeImage");
$("h3.phil:eq(0)").children('a').addClass("activeText");
$("a.scrollToText").click(function(){
cImDis = $(this).attr("rel");
var newScrollX = $('#im'+cIm).nextAll(".instOf" + cImDis + ":first").attr('id');
cIm = parseInt(newScrollX.substring(2,newScrollX.length),10);
nextIm();
return false;
})
$("#projectImages li img").click(function(){
cIm++;
cImDis = ((cIm-1) % totIm) + 1; // find remainder
nextIm();
return false;
})
function nextIm(){
var newScrollX = $("#im"+cIm);
var posX = parseInt(newScrollX.css("left"),10);
$('#projectImages').scrollTo((posX-marginLeft)+"px", 350, updateDisplay());
$("#feedback").prepend("<li>(cim:"+cIm+") (cimDis:"+cImDis+")</li>");
}
function updateDisplay(){
$("#cIm").text(cImDis);
$(".activeText").each(function(){
$(this).removeClass("activeText");
});
$("h3.phil:eq("+(cImDis-1)+")").children('a').addClass("activeText");
}
});