Question

我正在使用jQuery / JavaScript来尝试创建滚动条。

如您所料，父元素受overflow-x约束，因此子元素可以出现在可见框的前面和后面。

(1 hidden) (2 hidden) [ (3 visible) (4 visible) (5 visible) ] (6 hidden)

方括号代表父级中的可见项。

我目前正在使用jquery.Position().left，它使我相对于父级处于左侧位置。因此，第3项将在其当前位置为0。

但是，我想找到相对于所有父项内容的左侧位置-假设每个元素的宽度为100px，我希望看到的是300px。

我既不是jQuery也不是JavaScript专家，所以我需要一个线索来寻找如何找到将返回此数据的正确函数。

Answer 1

尝试使用jQuery：
$('#element3').offset().left获取偏移量。

Answer 2

一种方法是使用jquery.prevAll()来获取位于0的元素之前的所有元素，并将其jquery.outerWidth()（包括边距）加起来。

或者，也可以将幻灯片包裹在一个额外的div中，使该div为偏移父级，并获取相对于其的位置。此外，大多数滑块都是通过容器和轨道设置来实现的，而不是单独移动每个元素：

<div class="parent-with-overflow-x">
  <div class="that-div-i-just-mentioned">
    <div>item</div>
    <div>item</div>
    <div>item</div>
  </div>
</div>

查找元素在父元素内部的绝对左位置

2 个答案: