Javascript jquery offset（）获取每个（）img的偏移量信息，但只返回一个图像（可能是元素集中的最后一个图像）

我试图为一组缩略图中的每个图像获取offset（），然后使用此offset（）信息将标题弹出窗口的“left”css属性设置为直接显示在缩略图上方。我只需要为每个img缩略图保留偏移量（）

$("#pager a img").each(function(){

var currentName = $(this).attr("src");
var theNumToSub = currentName.length - 4;

$(this).hover(function(e){
    $(this).attr("src",$(this).attr("src").substr(0,theNumToSub)+"selected.jpg");
    $(this).parent().find(".caption").css("display","block");

    var parentOffset = $(this).offset();
    $(this).parent().find(".caption").css("left", e.pageX - parentOffset.left);

    if($(this).parent().find(".caption").length < 1){
    $(this).parent().append("<div class='caption'><span>"+$(this).attr("title")+"</span><div class='arrowDown'></div></div>");
    }
});

$(this).mouseout(function(){
    $(this).parent().remove(".caption");
    $(this).attr("src",$(this).attr("src").substr(0,theNumToSub)+".jpg");
    $(this).parent().find(".caption").css("display","none");
});

$（“#寻呼机a img”）。每个（函数（）{
var currentName=$（this.attr（“src”）；
var theNumToSub=currentName.length-4；
$（此）.hover（函数（e）{
$（this.attr（“src”），$（this.attr（“src”）.substr（0，theNumToSub）+“selected.jpg”）；
$（this.parent（）.find（“.caption”）.css（“显示”、“块”）；
var parentOffset=$（this.offset（）；
$（this.parent（）.find（“.caption”）.css（“left”，e.pageX-parentOffset.left）；
if（$（this）.parent（）.find（“.caption”）.length<1）{
$（this.parent（）.append（“+$（this.attr）（“title”）+”）；
}
});
$（this）.mouseout（函数（）{
$（this.parent（）.remove（“.caption”）；
$（this.attr（“src”），$（this.attr（“src”）.substr（0，theNumToSub）+“.jpg”）；
$（this.parent（）.find（“.caption”）.css（“display”，“none”）；
});

}))

我已经使用each（）来分隔迭代，但是有些人知道offset（）如何不存储每个img缩略图的信息。有没有另一种方法来存储这些信息

---

这是小提琴：

您的

。caption

类被设置为相对于父类的位置。因此，默认情况下，每个

.caption

元素都被定位为0x0y。 这就是为什么它们看起来都有相同的偏移量，它们有

---

您不能将左偏移量基于

parentOffset

，而是基于相应的

位置

好，现在有一个解决方案，不是使用jQuery来对齐，而是使用CSS来设置位置

1） 将Thumnail父对象的位置设置为“相对”，然后

2） 将标题的位置设置为“绝对”，这将使标题div分别响应父代码

3） 然后，只有在浏览器窗口隐藏标题时，才可以使用jQuery对齐标题

---

我将用这个css解决方案更新fiddle。

无法发现问题，但是您可以使用一些变量，而不是传递numtosub，为什么不直接将var分配给$（this）.attr（“src”）.substr（0，theNumToSub）？你还想缓存jQuery对象主要问题是它的offset（）部分，我为pespective粘贴了整个函数，因为它在each（）函数中，你为什么不做一个fiddle呢？这样会更容易帮助你OK会给你一个简短的链接这是小提琴，我把这个事件做成了一个鼠标移动，这样就很容易看到效果，基本上标题弹出窗口应该直接显示在缩略图上方：我基于相应的图像，但我听到了你关于.caption定位的说法，让我玩一下定位，看看我得到了什么。