页面遮罩层-并且阻止页面body滚动。bootstrap模态框原理

是 否 +2 论坛币

k人 参与回答

经管之家送您一份

应届毕业生专属福利!

求职就业群

赵安豆老师微信：zhaoandou666

经管之家联合CDA

送您一个全额奖学金名额~ !

立即领取

感谢您参与论坛问题回答

经管之家送您两个论坛币！

+2 论坛币

页面遮罩层，并且阻挡页面
body
滚动。bootstrap
模态框原理
实现思路：
1、需要有一个层将
body
遮住，放在
body
上方。2、修改body
的overflow
属性值为：
hidden
废话不多说了，将关键代码贴出来了，兼容火狐，谷歌，
ie遮罩层的样式代码，红色局部是关键的局部
代码如下
:.cover {
position:fixed; top: 0px; right:0px; bottom:0px;filter: alpha(opacity=60); background-color: #777;
z-index: 1002; left: 0px; display:none;
opacity:0.5; -moz-opacity:0.5;
}网页局部的代码
代码如下
:body
　　div class="container" style="height:200
0px;"
　　　　
div style="height:1000px;"/div
　　　　
a href="javascript:;" onclick="showMask()"
点我显示遮罩层
/ab ...

扫码加我 拉你入群

请注明：姓名-公司-职位

以便审核进群资格，未注明则拒绝

分享0 收藏0 回帖

关键词：Bootstrap Bootstra boots Trap boot