如何使用絕對位置忽略的onmouseover在DIV的JavaScript

我有以下代碼：如何使用絕對位置忽略的onmouseover在DIV的JavaScript

<body> 
    <div id="div1" style="position: absolute;"></div> 
    <div id="div2" onmouseover="not handling"></div> 
</body>

DIV1涵蓋DIV2。我需要在div2上處理onmouseover。我假設div1處理onmouseover事件並將其推遲到body（因爲body是父元素）。我無法將div1更改爲div2的「孩子」。有任何想法嗎？ thx

編輯：div1是半透明的，必須始終可見和div2填充顏色（不透明）。 div2也始終可見，因爲div1是半透明的。 div2內不能有div1。

來源

2010-02-08 ChRapO

爲什麼要處理一個元素的mouseover，它不會顯示給用戶，但會被另一個元素隱藏？ – rahul 2010-02-08 13:15:48

，因爲div1是半透明的 – ChRapO 2010-02-08 16:42:33

我有同樣的問題 - 在我的情況下，當我拖動一個對象時，所以我的'div1'（我的拖動代理）在鼠標下方，在我的'div2'區）。任何人都有答案？ – jinglesthula 2011-09-16 01:36:37

堆棧順序最高的元素（max z-index）將收到onmouseover事件。

爲了達到理想的效果，將div2包裝在另一個具有最高z-索引的div中，給div2一個比覆蓋層更低的z-index。

由於div3與div2具有相同的邊界框，因此我們將onmouseover事件附加到它，並讓事件處理程序對div2執行操作。

<body> 
    <div id="div1" style="position: absolute; z-index: 10; left:0; top; 0; width: 100%; height: 100%; opacity: 0.25; background-color: black;"></div> 
    <div id="div3" style="z-index: 20; position: relative;"> 
    <div id="div2" style="z-index: 0; position: relative;"> 
     </div> 
    </div> 
</body>

來源

2010-02-08 13:18:23

-1

的問題是，你不能點擊（或鼠標懸停）通過一個div。所以當div1'在'div2之上時，你有問題。

是不是可以爲div1和div2使用絕對/相對定位並且爲div2使用比div1更大的z-index？

來源

2010-02-08 13:20:54

其實你可以，onclick函數存在爲divs，它的工作原理。 – 2010-02-08 13:59:18

閱讀關於事件順序：http://www.quirksmode.org/js/events_order.html – VagueExplanation 2012-09-20 17:59:22

兩個建議去嘗試，不知道你的CSS或頁面佈局什麼：

改變DIV2的Z-指數比DIV1
認沽DIV2更高先在標籤順序

來源

2010-02-08 13:21:06 Ben

通過對添加的div的z-index使得DIV2的z軸折射率比DIV1的z索引

例如，更高

<body> 
    <div id="div1" style="position: absolute; z-index: -1"></div> 
    <div id="div2" style="position: relative; z-index: 1000" onmouseover="alert('mousemove')"></div> 
</body>

z-index指定元素的堆棧順序（也可以是負值）。

W3Schools on z-index。

來源

2010-02-08 14:03:08

我可以改變z-index，但div1會隱藏在div2後面，這就是問題所在。 :( – ChRapO 2010-02-08 14:27:33

我不知道爲什麼你需要一個div裏面的div，但爲什麼不讓div1背景透明？ – 2010-02-08 18:43:37

div1是半透明的，必須始終可見，並且div2由顏色填充（不透明）。因爲div1是半透明的，所以div1裏面不能有div1 – ChRapO 2010-02-08 23:31:45

忘記z-index，因爲你想要顯示div1，而不是div2。

嘗試使用指針事件：無法在div1上，因爲你不希望它影響onmouseover事件。

<body> 
<div id="div1" style="position: absolute; pointer-events:none"></div> 
<div id="div2"></div> 
</body>

來源

2016-10-13 17:16:02 Pablo

如何使用絕對位置忽略的onmouseover在DIV的JavaScript

回答

相關問題