Программно добавить фиксированный нижний колонтитул в JqueryMobile

Question

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

Вот мой код, чтобы добавить html-разметку для нижнего колонтитула и снова вызвать функцию «создания» jquerymobile, чтобы заполнить стиль для нижнего колонтитула.

            menu += '<div data-role="footer" data-position="fixed" id="menu" data-theme="a">';
            menu +=     '<div data-role="navbar">';
            menu +=         '<ul>';
            menu +=             '<li><a href="'+GLOBAL.APP_ROOT+'simulator/list1">List1</a></li>';
            menu +=             '<li><a href="'+GLOBAL.APP_ROOT+'simulator/list2">List1</a></li>';
            menu +=             '<li><a href="'+GLOBAL.APP_ROOT+'simulator/list3">List3</a></li>';
            menu +=         '</ul>';
            menu +=     '</div>';
            menu += '</div>';
            $('#pHome').append(menu).trigger('create');

Моя проблема в том, что нижний колонтитул не появляется внизу страницы, он появляется сразу после содержимого div. Я думаю, что мне нужно обновить позицию div нижнего колонтитула вручную, но я не знаю, как это сделать. Кто-нибудь может мне помочь?

Answer 1

Попробуйте $.mobile.fixedToolbars.show(); после этой строки $('#pHome').append(menu).trigger('create');. Это должно заставить jquery mobile пересчитать положение фиксированной панели инструментов и показать ее. Это должно держать нижний колонтитул внизу.