javascript - 如何创建覆盖 div 以适合屏幕的其余部分

Question

如何创建具有黑色背景的覆盖 div 比如说，我有一个 anchor 可以将 div 触发到弹出窗口，这是 anchor :

<a href="#" title="Open online form" id="open">Suggest</a>

这是居中 div 的 css :

.centered
{
  width:55%;
  position:fixed;
  left:18%;
  height:200px;
  border:2px solid red;
  display:none;
}

 $("#open").live('click', function(){
            var divTop = 75 + $(window).scrollTop();    // places the popup 75px from the top       
         $('.centered').css({'top':divTop, 'display':'block', 'z-index':'5005'});
            });

我之前使用 jquery ui modal 来完成这些事情，但现在我的一些脚本在使用它时停止工作，加上 50kb+ 是我目前在我的网站上不需要的东西，已经加载了应用程序 6 秒。有什么建议吗？

Answer 1

您考虑过blockUI for this? 8k GZip 之前，这就是它的全部作用，不应该给您使用其他脚本带来任何麻烦。对我来说主要的好处是它可以处理 IE6 下拉菜单、所有小烦恼等问题。

您的情况是:

$.blockUI({ message: $('.centered') }); //show
$.unblockUI(); //hide