2012-02-27 3 views
0

У меня есть простая страница с фиксированным верхним и нижним колонтитулом. Когда он переместится со страницы 1 на страницу 2, нижний колонтитул на странице сначала отображается в том месте, где содержимое страницы 2 заканчивается (несколько посередине), а затем после завершения страницы сдвигает верхнюю позицию нижнего колонтитула и перемещается вниз. Есть ли способ избежать этого?Почему нижний колонтитул переустанавливается после слайда страницы

enter image description here

+0

Это действительно странно ... я никогда не видел ничего подобного раньше. – connorbp

+0

его только когда u r загружает страницу в первый раз. – coure2011

ответ

0

В обработчике pageshow событий второй страницы вы можете попробовать добавить следующий фрагмент кода:

$.mobile.fixedToolbars.show(true); 
+0

панель инструментов не скрыта, она просто переклассифицирована – coure2011

+0

Даже если она будет перемещена, этот код немедленно разместит ее внизу. Если вы можете опубликовать образец кода, в котором эта проблема может быть воспроизведена, я рассмотрю ее. – user700284

+0

вам нужно будет найти способ переопределить нижний колонтитул, который будет скрыт в первую очередь, потому что его скрытие подталкивает его к середине страницы. см. мой ответ. – frequent

0

Я считаю, что это ошибка в JQM. Это происходит, когда содержание страницы короче размера экрана.

Моя догадка, почему это происходит:

  • После переходов, JQM вызывает UpdateLayout, который пересчитывает положение колонтитула, прячась-recalulate-показ
  • Панели инструментов скрыты с помощью CSS: верхнее свойство и настройки это до 0
    Итак, на длинной странице, чтобы скрыть нижний колонтитул CSS: top установлен в , подталкивая ваш нижний колонтитул туда, где он находился бы в статическом потоке страницы = в конце вашего документа.
  • Чтобы показать нижний колонтитул, JQM вычисляет, где вы находитесь на своей странице, и размер экрана и высота нижнего колонтитула, и появляется CSS: top = -12345px. Проверьте верхний слой CSS в Firebug, когда нижний колонтитул виден.

= скрыть: CSS-топ = 0
= показать: CSS-топ = -1234px

Теперь, если ваша страница короче, чем высота экрана (экран 600px, 200px страница для пример), скрывая нижний колонтитул, установив CSS: top = 0 будет прикрепляться к концу страницы, которая находится прямо посередине экрана с разрешением 200 пикселей.

С updateLayout пересчитывает нижний колонтитул, он скрыт-пересчитан. И там у вас есть свой прыгающий нижний колонтитул.

Я сделал исправление с запросом на тягу на Github - https://github.com/jquery/jquery-mobile/pull/3050.

Я предполагаю, что панели инструментов перейдут на pos: исправлено с JQM 1.1. никто больше не потрудился потянуть его. Но он все же работает.

Смежные вопросы