灯箱背景效果

Question

我刚刚开始学习jQuery，我不知道如何启用类似于灯箱的背景效果。

我希望我的<div>（注册向导）以100％的不透明度出现，我希望其背后的所有其他内容都在50％左右，不透明且不可点击。

如何使用jQuery实现这一目标？

Answer 1

这是：

$('<div id="overlay" />').css({
   position:'fixed'
 , width: '100%'
 , height : '100%'
 , opacity : 0.6
 , background: '#000'
 , zIndex:9999
 , top: 0
 , left: 0
}).appendTo(document.body);

DEMO

您可以将上面的代码放在一个函数中，并在需要覆盖时调用它。要在不需要时将其删除，您可以：

$('#overlay').remove();

---

仅供参考，您也可以在一个类中将CSS上面的样式放在CSS中，然后在需要时使用jQuery的addClass到body，并在需要删除时使用removeClass。