Я борюсь с проблемой календаря с простыми лицами на веб-странице, отображаемой на мобильном устройстве (планшете). Кажется, что значения css, рассчитанные простыми лицами для отображения всплывающего календаря, не пересчитываются при повороте окна (вам нужно снова щелкнуть по нему, чтобы пересчитать).
Вот пример:
(обратите внимание на css с левой стороной: 719,406 пикселей, рассчитанной по праймерам). Пока все в порядке.
Обратите внимание, что всплывающее окно больше не находится рядом со значком календаря. Кроме того, css утверждает, что при одинаковом левом значении.
Положение теперь хорошее, с другим и правильным значением слева: 1061,91px.
Как я могу заставить простые лица автоматически перенастраивать css без необходимости каждый раз дважды щелкать?
Решение, найденное для меня до сих пор, заключалось в том, чтобы добавить пользовательское значение для выравнивания по правому краю с экраном и переопределить левое:
.ui-datepicker.ui-widget.ui-widget-content {
left: auto !important;
right: 10px;
}
Но приведенное выше решение очень специфично для этого экрана, и, к счастью, у меня всегда есть кнопка календаря в правой части экрана, поэтому я всегда могу предположить, что 10 пикселей справа будут выглядеть нормально.
Я также заметил, что ui-datepicker-div является дочерним элементом элемента body, поэтому я не могу связать его с кнопкой с помощью css.
Любые идеи/помощь общего решения будут высоко оценены. Версия Primefaces: 6.2
Извините, забыл добавить версию PF (6.2, сейчас тоже добавил в пост).
Эта проблема исправлена в Primefaces 7.0.RC3. Он был выпущен неделю назад. https://mvnrepository.com/artifact/org.primefaces/primefaces/7.0.RC3
Можете объяснить, как эта проблема была устранена? мне так интересно, спасибо
Primefaces обновил код JQuery, который теперь меняет положение всплывающей панели календаря при изменении размера окна.
Я думаю, что это должно быть частью базового компонента javascript, а не конкретно PrimeFaces. Он использует внешний компонент javascript для работы с календарем. Вы можете посмотреть в источнике PrimeFaces, который это (может быть, «старый» jquery-календарь или что-то более новое, что неясно, поскольку вы не опубликовали информацию о версии, ни минимальный воспроизводимый пример. Что касается добавления его в тело, это обычное решение чтобы предотвратить другие проблемы. Вы можете проверить, есть ли у компонента «appendTo», который может помочь в этом случае, но может привести к другим проблемам, связанным с размещением, сокрытием (z-index) и т. д.