phonegap 应用程序不会在方向更改时更新样式答案

【问题标题】：phonegap app is not updating style on orientation changephonegap 应用程序不会在方向更改时更新样式
【发布时间】：2019-05-10 07:49:55
【问题描述】：

我正在为 Android 和 iOS 设备构建一个 phonegap 应用程序。一切正常，但我有一个默认 100% 宽度的弹出菜单。它在纵向模式下覆盖 100% 的宽度，但是当我将其更改为横向模式时，它会随机将纵向模式样式应用于弹出窗口，并且它只是覆盖了它过去的宽度。

如何确保通过方向更改样式更新而不会失败？我能够在 chrome 开发工具模拟器、android 和 iOS 设备中重现这种情况。

下面的 dom 元素是由 Kendo 创建的。并且样式也是动态生成的。

下面的样式是为纵向模式生成的

这个是横向模式，会产生问题。它非常随机，没有特定的模式。

【问题讨论】：

标签： android ios css phonegap

【解决方案1】：

目前我找到了一项解决方法，我设置 100% 高度和 left:0px 以获得所需的行为。虽然问题是上面共享的 dom 元素是由 kendo 生成的并且没有唯一的 ID，所以我使用 .closest 来获取这些父元素。

kendo popover 也有开放事件，有助于设置这种风格。

onFooterOpen: function() {
        $( "#more-option" ).closest( ".k-animation-container" ).css("width","100%");
        $( "#more-option" ).closest( ".km-popup-wrapper" ).css("width","100%");
        $( "#more-option" ).closest( ".k-animation-container" ).css("left","");
}

【讨论】：