Question

我希望当onmouseover在特定部分上将OPACITY #fff 0.2层放在除选定类之外的所有内容上，即表

与你一样：

.tableHighlight:hover{background-color:#eee}
<table id='table-main' class='tableHighlight'>
...

但是反转（将图层放在其他所有内容上，而不是表格本身）

Answer 1

我想我明白了。

$('#IDyouWant').on('mouseenter',function(){
    $('body').prepend('<div class="curtain"></div>'); // add a layer in front of everything
    $('#IDyouWant, .tableHighlight').css({'z-index':'10'}); //brings section and highlighted element to front.
}).on('mouseleave',function(){
   $('.curtain').remove(); // remove layer
   $('#IDyouWant, .tableHighlight').removeAttr('style'); //remove z-index from section and highlighted element
});

和.curtain

的css

.curtain {
    display:block;
    width:100%;
    height:100%;
    position:fixed;
    top:0px;
    left:0px;
    background:#FFF;
    opacity:0.8;
    z-index:9;
}

小提琴：

http://jsfiddle.net/5Y3Hf/1/

<强>更新：

请记住，您需要在所有内容之前的元素必须在css seted中具有position属性。它可以是任何位置，在我的示例中为position:relative;，但您必须为position作品设置z-index

除选定块外的Onmouseover Opacity Layer

1 个答案: