当另一个div重叠时在div上应用样式

Question

我有两个div。 Div1和Div2。 Div1是一个带有z-index的固定div，Div2是可移动的。

我想要做的是在Div1下移动Div2时更改<li><a href="rooms.html">Rooms</a></li> 的颜色。

如何检测Div2是否与Div1重叠以应用这些样式？

我宁愿不使用jQuery。我使用Angular 2 - Rc4。它适用于移动应用。

Answer 1

在获取通过getBoundingClientRect（）检索到的div1和div2的详细信息后，您可以使用下面的内容：

  

var overlap =！（div1 .right＆lt; div2 .left ||                   div1 .left＆gt; div2 .right ||                   div1 .bottom＆lt; div2 .top ||                   div1 .top＆gt; div2 .bottom）