js蒙版效果

Ⅰ extjs的alert的蒙版效果的原理到底是什麼啊有誰能從從js，css層面上解釋一下他的實現原理嗎 我用fireb

你說的是不是常見的那種 彈出一個半透明遮罩層,同時不能操作頁面相關對象,只能操作在遮罩層以上的內容?

實際這個效果很簡單,半透明遮罩層(是不是半透明無所謂)是實現了和文檔document同寬同高,但是css的z-index屬性要大於普通內容的一個空白div,這個div做了半透明效果,隔離了所有事件,你滑鼠在網頁上面的點擊,移動,拽托等操作只作用於這個div,因此原網頁的所有事件均失效.
在遮罩層上一般還會有一個可操作域(div2),這個同理,這個div2的z-index要大於遮罩層的z-index,從而他會在遮罩層以上,而能實現其操作.
以上是原理,那麼實現起來要分一些幾個步驟:
1,遮罩層(可以事先就進行半透明處理和document等寬等高處理,這個需要通過js編寫)和可操作域(div2) 的display屬性設置為none.處於隱藏狀態.
2,當網頁需要激活遮罩事件的時候,js將遮罩層和可操作域的display設置為block.處於顯示狀態,當在可操作域關閉事件觸發的時候,同時將遮罩和可操作域隱藏.

需要注意的是,遮罩層最好是在body的根目錄下,並position設置為絕對定位,這樣布局比較方便

Ⅱ css如何給圖片加一個蒙版遮罩

1．首先，看一下HTML，一個img圖像控制項和一個帶有樣式的div，其中包含文本。這個就是蒙版遮罩層。