单击时显示div，其余背景模糊

Question

！[在这里输入图片说明] [1]在阅读了一些问题之后，仍然对如何使div出现在Google上的链接（如Google上的链接）以及查看所有朋友（当我们单击查看所有div上）时仍然存有疑问出现在页面中央，其余背景变得模糊/不透明。任何人都可以帮我的代码，谢谢

就像这里，当我们单击上载照片时，一个div出现并且背景变得模糊不清

Answer 1

我创建了一个JSBIN来展示一个不错的效果：

演示

$('.open').click(function(){
  $('#lightbox').fadeTo(1000, 1);
  $("#wrapper").css({'text-shadow': '0px 0px 10px #000'});
});

$('.close').click(function(){
  $('#lightbox').hide();
  $("#wrapper").css({'text-shadow': '0px 0px 0px #000'});
});

这只是一个想法，现在由您自己决定玩细节！

您需要：-一个隐藏的DIV（#lightbox）位置：绝对显示：隐藏，它将覆盖您的所有页面。要获得初始的〜crossbrowser“模糊”效果，只需将白色.png 50％透明设置为背景。
-要创建模糊效果，必须使“主”文本透明并设置初始“ 0px”模糊：

color: transparent;
text-shadow:0px 0px 0px #000;

jQuery将处理模糊的“切换”。