如何使用选定的类获取父 div 和 img 标签之间的距离？答案

【问题标题】：How to get distance between parent div and img tag with a selected class?如何使用选定的类获取父 div 和 img 标签之间的距离？
【发布时间】：2014-11-09 19:34:14
【问题描述】：

我有一个缩略图库，我想获取所选 img 和父 div 之间的距离（小图像|左侧）。我尝试了偏移/位置，但 someshow 不起作用。请给我一个提示或什么的。谢谢！

$(function(){
var $big= $("#big-image img");
var $small = $('.small-images img');
$big.not(':first').hide();
$small.last().addClass('selected');

$small.click(function(e){
    $small.removeClass('selected');
    var i = $(this).addClass('selected').index();
    $big.hide().eq(i).show();
});

$('.next, .prev').click(function() {
    var m = $(this).hasClass('next') ? 'next' : 'prev';
    var $t = $small.filter('.selected')[m]();
    if ($t.length) {
        $small.eq($t.index()).click();
    }
});

});

Jsfiddle

【问题讨论】：

标签： jquery

【解决方案1】：

好的，我再试一次，因为我第一次误解了这个问题。

您需要使用offset.left。您必须获得父项偏移量和选定项偏移量并从选定项中减去父项。这样您就可以获得所选项目的相对偏移量（到父项）：

var parentOffsetLeft = $(".small-images").offset().left;
var imgOffsetLeft = $(".selected").offset().left;
var relativeOffsetLeft = imgOffsetLeft - parentOffsetLeft;

这是一个演示小提琴：http://jsfiddle.net/theagitator/qqqqbqaz/9/

【讨论】：

如果这不是你要找的，请更清楚你的意思 get the distance between selected img and parent div(small-images|left side)
不，这不是我要找的。我会尝试更好地解释：我想要具有选定类（红色边框）的 img 和小图像 div 的左侧（黑色边框）之间的像素距离。