当其高度设置为“拉伸到容器”时，LightSwitch HTML 根屏幕布局延伸到屏幕之外

Posted 2023-03-06

【中文标题】当其高度设置为“拉伸到容器”时，LightSwitch HTML 根屏幕布局延伸到屏幕之外

【英文标题】：LightSwitch HTML root screen layout extending beyond the screen when its height is set to "stretch to container"

【发布时间】：2017-09-10 11:29:09

【问题描述】：

亲爱的，

如果我有一个屏幕并且我将根布局的高度设置为“拉伸到容器”并确保页脚中没有按钮可见（因此页脚被折叠），您会注意到页面布局将不必要地扩展超出浏览器窗口的高度（导致出现滚动条），它将与标题一样延伸（因此，如果标题为 60px，则底部的额外空间将为 60px）。这看起来不专业，并且随着页脚按钮的出现和消失，浏览器滚动条也会出现和消失，在大多数浏览器中，滚动条会向内和向外拉伸页面内容以占据其宽度范围，从而导致页面内容出现不舒服的抖动。

下面是一个截图来说明：

有谁知道解决这个问题的方法吗？

【参考方案1】：

解决此问题的一种方法是修改 Microsoft LightSwitch 库的 _createScreenFrameHeader 函数中的 $header 声明。此声明需要从以下更改：

var $header = $("<div class='msls-header' data-role='header' data-update-page-padding='false' data-tap-toggle='false' ></div>")

到以下（在声明的末尾添加 data-position='fixed' 属性）：

var $header = $("<div class='msls-header' data-role='header' data-update-page-padding='false' data-tap-toggle='false' data-position='fixed' ></div>")

【讨论】：

这太不可思议了。你在 MSFT LightSwitch 团队吗？！