jQuery – 如何在叠加上放置DIV？
我试图用尽可能少的jQuery代码进行模态对话，因为我的项目已经加载了太多的jQuery。
所以，我首先需要一个覆盖，这是通过以下方式实现的：
$('body').wrapInner('') .css('opacity','0.5') .css('z-index','2') .attr('id','dim1'); 现在无视我有另一个例程来杀死＃dim1上的点击事件，而这个模态存在。 所以，现在我需要在上面绘制我的modal dialog：
$('body').append('My Test'); $('#test') .css('opacity','1.0') .css('position','fixed') .css('color','#000') .css('z-index','2000') .css('height','300px') .css('width','300px') .css('top','50%') .css('left','50%');
然而，当我这样做时，我最终会变暗#test，当我不想让它变暗时 – 只是背后的东西。 有什么诀窍？
在这里看到这个快速演示 ，关键在于模态在不透明背景的顶部是绝对的。 该演示动态地将背景叠加div和模态div添加到正文中，但您可以在html中定义它们并只显示它们。
同意没有必要使用插件进行模态效果，大多数插件都有很多选项，因此如果你只需要最简单的效果就不需要膨胀。 – 注意我们可以用两行而不是三行来做 – 而且没有插件！
此外，定义css类并添加这些更容易，而不是在脚本中为元素添加内联样式。 更易于维护。
我认为你最好的解决方案可能是使用jquery插件。 一个快速的谷歌搜索引发了这个： http ： //www.ericmmartin.com/simplemodal/这是你需要三行！
如果你想要更多， jquery叠加插件页面上有加载
从它的外观来看，CSS是使事情正确的关键，大多数这些例子都应该附带演示CSS供您调整。
显然这会带来更多您关注的外部jquery代码 – 但我建议一个编写良好且稳定的插件可以节省大量的工作/时间/代码行！