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插件，可以在开发的项目中重用！