javascript - 关于js如何实现一个悬浮窗口的问题

Question

我希望。在我点击回复后，弹出一个p 。弹出p之后。网页变成灰色透明。除弹出的 p 之外其他不可用。让提交回复后。弹出的p消失。并其他可用。
大概效果图就像百度登陆这样的。。。

Answer 1

1.灰色半透明是一个遮罩层，设置颜色和不透明度，设置点击事件

$('#mask').on("click", function(){ 
    return false; 
    });

//还要停止冒泡啥的

2.悬浮窗也是一个p，p要有高度和宽度，里面在设计一个表单
设置一定的z-index，计算p居中，
$('#top-p').css({left: (pageX-p.width())/2, top: (pageY-p.height())/2});
大概就是这个样子了。

Answer 2

给楼主推荐一个很好用的弹窗插件：贤心－Layer，这个插件支持自定义样式，用起来很方便。

Answer 3

jQuery.blockui.js

Answer 4

楼主看看李炎恢的js视频第97讲 可以实现楼主要的效果 不过是原生js写的

Answer 5

可以参考下bootstrap中关于模态框的这个插件modal.js。

Answer 6

不考虑兼容性的话<dialog>标签是不错的选择 Dialog element