jQuery生成全頁面的懸浮覆蓋層效果（overlay）

可能在大家開發的過程中，往往需要自己生成一個全頁面的覆蓋層，以便讓用戶能夠把注意力專注於開發者指定的某一個區域，在這里開發小技巧里，我們使用非常簡單的代碼生成類似的效果，如下：

1. $("#overlay")
2. .height(docHeight)
3. .css({
4. 'opacity':0.8,
5. 'position':'absolute',
6. 'top':0,
7. 'left':0,
8. 'background-color':'#AAAAAA',
9. 'width':'100%',
10. 'z-index':5000
11. });

 

在以上代碼中，我們使用.css方法來生成需要的效果，這里我們添加一個id="overlay"的div層，並且設置透明度0.8，生成一個覆蓋層效果。

注意這里我們的docHeight，使用如下代碼獲取：

1. var docHeight = $(document).height();

 

是不是非常簡單，當然大家可以自己將這段代碼修改成一個簡單的jQuery插件，可以在開發的項目中重用！