javascript/jquery：檢測前兩個元素中的哪一個

我有一堆元素，通過各種方法定位（絕對，固定和靜態），各種z索引，其中一些是其他父項。有沒有一種簡單的，一般的方法來確定，對於任何兩個元素，哪一個在另一個之前？javascript/jquery：檢測前兩個元素中的哪一個

我想到的辦法是這樣的：

Let A and B be the two elements. 
Let X and Y be two sibling elements such that X is A or an ancestor of A, and Y is B or an ancestor of B. 
If X has a higher z-index than Y, then A is in front of B.

然而，這似乎是很多的代碼一個簡單的問題，我也擔心可能存在的角落情況下，它不」給出正確的答案。任何人有更好的主意？

來源

2012-10-17 josh

我的意思是，這些元素的計算樣式將返回任何父元素的z-index的是，如果它是組。 'static'元素沒有收到z-index，他們使用'auto'，然後默認在樹上。如果他們的父母沒有靜態和z-索引以外的職位，那麼他們只會擁有自動，這對於所有意圖和目的來說也不是0。 – Ohgodwhy

如果你有一個它們可能重疊的x，y點的id，你可以使用'document.elementFromPoint（x，y）'返回最前面的元素。 – Shmiddty

@Shmiddty：我想過，但交叉點可能有第三個元素（用例是drag-n-drop代碼，所以我拖動的東西可能會掩蓋交叉點） – josh

所以這就是我想出的。不是很好。做了幾個假設，通常爲我工作，但可能不會爲你工作：

假設條件是，孩子總是在父母面前（你可以通過混合相對和絕對定位打破了這種假設）
假設你不會給兩個同胞z-index。計數自動爲0

下面的代碼（在CoffeeScript中，使用jQuery）：

is_in_front_of = (div1, div2) -> 

    z_index = (d) -> 
     z = d.css 'z-index' 
     z ?= 0 
     if z == 'auto' then z = 0 
     return z 

    if $.contains div1[0], div2[0] 
     return false 

    if $.contains div2[0], div1[0] 
     return true    

    while div1.parent().length > 0 and not $.contains div1.parent()[0], div2[0] 
     div1 = div1.parent() 

    while div2.parent().length > 0 and not $.contains div2.parent()[0], div1[0] 
     div2 = div2.parent() 

    return z_index(div1) > z_index(div2)

來源

2012-10-17 18:31:11 josh

javascript/jquery：檢測前兩個元素中的哪一個

回答

相關問題