приложение phonegap не обновляет стиль при изменении ориентации

Question

Я создаю одно приложение phonegap для устройств Android и iOS. Все работает нормально, но у меня есть одно всплывающее меню с шириной по умолчанию 100%. Он покрывает 100% ширину в портретном режиме, но когда я переключаю его в ландшафтный режим, он случайным образом применяет стили портретного режима к всплывающему окну, и он просто покрывает прошлую ширину, которую имел.

Как сделать так, чтобы при изменении ориентации стиль обновлялся без сбоев? Я могу воспроизвести этот случай в эмуляторах инструментов разработчика Chrome, устройствах Android и iOS.

Элемент ниже dom создан Kendo. А также стили генерируются на лету.

Нижеследующий стиль генерируется для портретного режима

А это для ландшафтного режима, который создает проблему. Он очень случайный, и для него нет определенного шаблона.

Answer 1

В настоящее время я нашел одну работу, где я устанавливаю 100% высоты и оставил: 0px, чтобы получить желаемое поведение. Хотя проблема заключалась в том, что совместно используемый элемент dom генерируется kendo и не имеет уникального идентификатора, поэтому я использовал .closest, чтобы получить эти родительские элементы.

Также в кендо поповер есть событие open, которое помогает установить этот стиль.

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","");
}