jQuery在菜单悬停上添加透明叠加

Question

我正在尝试重新创建here

找到的效果

当鼠标悬停在mega菜单上时＆gt;我假设的背景/不透明度在页面包装器上更改的元素，但我不确定使用jQuery实现此目的的最佳方法。

我是否应该使用css来更改背景或不透明度或jQuery本身以尝试重新创建此效果。

任何指针都会非常感激。

Answer 1

你不需要Javascript来完成它：）

对你内心的孩子使用position: fixed，如下所示：

<li>
   <a href="#"></a>
   <div class="overlay"></div>
</li>

和..

.overlay {
   display: none;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
}

li:hover .overlay {
   display: block;
}

示例： http://jsfiddle.net/serb4q2v/