LightSwitch HTML 根屏幕布局在其高度设置为 "stretch to container" 时延伸到屏幕之外
LightSwitch HTML root screen layout extending beyond the screen when its height is set to "stretch to container"
亲爱的,
如果我有一个屏幕并将根布局的高度设置为 "Stretch to Container" 并确保页脚中没有可见按钮(因此页脚已折叠),您会注意到页面布局将不必要地超出浏览器 window 的高度(导致出现滚动条),并且它会完全扩展到 header 的高度(所以如果 header 是 60px,额外的 space 在底部将是 60px)。这看起来很不专业,随着页脚按钮的出现和消失,浏览器滚动条也会出现和消失,在大多数浏览器中,滚动条会向内和向外拉伸页面内容以占据其宽度范围,从而导致页面内容出现不舒服的抖动。
下面截图说明:
有人知道解决这个问题的方法吗?
解决此问题的一种方法是修改 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>")
亲爱的,
如果我有一个屏幕并将根布局的高度设置为 "Stretch to Container" 并确保页脚中没有可见按钮(因此页脚已折叠),您会注意到页面布局将不必要地超出浏览器 window 的高度(导致出现滚动条),并且它会完全扩展到 header 的高度(所以如果 header 是 60px,额外的 space 在底部将是 60px)。这看起来很不专业,随着页脚按钮的出现和消失,浏览器滚动条也会出现和消失,在大多数浏览器中,滚动条会向内和向外拉伸页面内容以占据其宽度范围,从而导致页面内容出现不舒服的抖动。
下面截图说明:
有人知道解决这个问题的方法吗?
解决此问题的一种方法是修改 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>")