最近公司有需求说客户的屏幕分辨率很大,导致页面显示高度老缺失下面一大截。对这个问题就行一个问题的解决。
屏幕信息:
screen.height // 屏幕的高度
screen.width // 屏幕宽度
screen.availHeight // 屏幕可用高度:即屏幕高度减去上下任务栏后的高度,可表示为软件最大化时的高度
解决方案如下:
案例代码如下:
<div class="register_b" id="LeftBox">
<div class="contact-top">
<fieldset class="layui-elem-field layui-field-title">
<legend>联系我们</legend>
<div class="layui-field-box">
<div></div>
</div>
</fieldset>
<label class="layui-form-label title">地址:</label>
<label class="text"></label>
<br />
<label class="layui-form-label title">业务支持电话:</label>
<label class="text">xxxxx</label>
<br />
<label class="layui-form-label title">技术客服电话:</label>
<label class="text">xxxxx</label>
</div>
</div>
<script>
// 获取屏幕分辨率的高
var div_height = window.screen.availHeight;
var height = div_height - 360;
$("#LeftBox").height(height);
</script>
问题的解决很简单就是获取当前屏幕的高度,减去头部和脚部加起来的高度而已(360就是头部加脚部的高度)。以上就是问题的解决方案,如有侵权请联系本人删除