首页 > 代码库 > 移动端遮罩层,内容大小改变动态大小
移动端遮罩层,内容大小改变动态大小
遮罩层的实现
.mask{ position:absolute; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,.3); z-index:1000;
display:none; }
解释:如果想在某个区域设置遮罩层,就把.mask放在某个区域的div下;根据自己的需求设置宽高,定位也要适当删减修改;
层级就根据自己需求设置大小;
本人遇到的情况是数据不固定,遮罩层大小不固定;
数据多的情况下遮罩层正常遮罩,如果没数据或数据少,遮罩层在下半部就不显示了;
遮罩层不能设置固定宽高,要根据数据多少而定,因为这个是移动端,tab栏不是固定的,会随页面滚动;
解决方案:
使用js动态控制遮罩层复盒子大小;
$(".tab").click(function(){ if($("body").height()<$(window).height()){ $("body").css("height",$(window).height()); }else{ $("body").css("height","auto"); } })
因为数据是动态加载的,判断要放在click里面判断,否则获取body的高度不准确;
以上内容仅为个人总结,如有错误请指出;谢绝复制转发;
移动端遮罩层,内容大小改变动态大小
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。