特定の要素の角度/ HTMLガラスペイン

Question

HTML要素Eにはガラスペイン（例：砂時計）を、どのようにしてEの境界内にのみガラスペインを作成できますか？
ガラスパネルとは、砂時計を持つ半透明で、E要素境界内の領域だけが重なっていることを意味します。ガラスパネルがアクティブになっていると、その背景に何もアクセスできない。
uibModal libを試してみましたが、ウィンドウ全体に広がっていますが、特定の要素だけを重ねる必要があります。

は

Answer 1

ラミ
、ありがとうここのトリックは強大なのz-indexプロパティといくつかの不透明度を使用しています。に干渉しないように（絶対：今

<aside style="width:300px; height:100vh; float:right; z-index:1;"> </aside> 

は、あなたがしなければならないすべては、位置とそれにdiv要素を挿入することです：

のは、あなたが幅300ピクセル、高さの100VHと横方向の要素を持っているとしましょうあなたのdivの他のオブジェクト）とzインデックスの高い値：

<aside class="parent"> 
    <div class="pane"></div> 
</aside> 

CSS：

.parent{ 
    width:300px; /*or your width/height settings...*/ 
    height:100vh; 
    float:right; /*just for the example, you can set your div wherever you want*/ 
    z-index:1; 
} 
.pane{ 
    height:100vh; /*needed to fill your parent div*/ 
    width: 300px; 
    z-index:2; 
    position:absolute; 
    opacity: 0.6; /*pane effect*/ 
} 

このようにして、divに「ウォーターマーク」をクリックすることができなくなり、ペイン効果で終了します。