jquery mobile исправил колонтитулы не работает - PullRequest
Новая
       8

jquery mobile исправил колонтитулы не работает

0 голосов
/ 19 марта 2012

Итак, у меня есть фиксированный заголовок в JQM 1.1, например:

---- Начало редактирования ----

В соответствии с запросом, здесь более полный вид страницы: 

<div id="listPage" data-role="page" class="page-ovveride">

        <div data-role="header" id="applicationHeader" data-theme="b" data-position="fixed">
            <h1 class="ui-title" role="heading" aria-level="1">Mobile</h1>
        </div> 

        <div data-role="content" id="applicationContent">
             <ul id='ListTable' data-role="listview" data-inset='false'>  
                <!-- Placeholder for list table -->          
            </ul> 
        </div> 

        <div data-role="footer" id="applicationFooter" data-theme="b" data-position="fixed">
            <div id="navbar" data-role="navbar" > 
                <ul> 
                    <li class="ui-btn-active"><a href="#listPage" id="list" data-icon="grid" data-transition="none">List</a></li> 
                    <li><a href="#StuffPage" id="stuff" data-icon="star" data-transition="none">Stuff</a></li> 
                    <li><a href="#MaorStuffsPage" id="moar" data-icon="alert" data-transition="none">Moar</a></li> 
                </ul> 
            </div>
        </div> 

    </div> <!-- end list page -->

Класс page-ovverride выглядит следующим образом.По некоторым причинам, я думаю, что JQM вставлял кучу отступов сверху и снизу, что вызывает проблемы.Вот как выглядит класс: 

.page-ovveride {
    padding-top:0 !important;
    padding-bottom:0 !important;
}

, и вот как я заполняю таблицу 

$List.append(
    $('<li>').attr('id', id).append(
        $('<a>').attr('href','#newPage').attr('data-transition', 'slide').append(
        $('<h3>').text(name),
        $('<p>').text(description)
    )));

, а затем после цикла: 

$List.listview('refresh');

---- КОНЕЦ РЕДАКТИРОВАНИЯ ----

Но по какой-то причине это не заставляет вещи выглядеть исправленными в ЛЮБОМ браузере.Я смотрю 1.1 документы здесь , но это, похоже, не работает?Кто-нибудь знает, что происходит?Дайте мне знать, если вам нужно больше информации!

Спасибо!

обновление: даже когда я убираю класс page-ovverride, он все равно не работает.Что здесь происходит!?

Ответы [ 4 ]

3 голосов
/ 21 марта 2012

Я понял это.Я включал устаревший файл из одной из моих самых ранних реализаций JQM, где я использовал ролик темы, который включал файл jquery.mobile.structure.css.Это было слишком много стилей и вызывало все виды дурацкого поведения.Надеюсь, это кому-нибудь поможет!

0 голосов
/ 02 декабря 2015

Вот еще одна возможная причина: у меня была проблема с фиксированным заголовком, который не работал для страницы с динамически добавленным контентом. Оказалось, что если содержимое страницы изначально было короче окна, jQueryMobile добавлял в заголовок класс «ui-fixed-hidden», который не удалялся, когда содержимое становилось больше окна.

Я вылечил проблему, добавив следующую строку кода, сразу после записи содержимого в div на странице, называемой resultsdiv: 

    resultsdiv.parents('.ui-page').find('.ui-header').removeClass('ui-fixed-hidden');

Это ужасный неряшливый взлом, но до сих пор работал.

0 голосов
/ 24 апреля 2012

Попробуйте это: 

<div id="listPage" data-role="page" class="page-ovveride" data-fullscreen="true">
.
.
.
.
</div>
0 голосов
/ 19 марта 2012

У меня работает: http://jsfiddle.net/XRKcX/1/. Возможно, вы забыли что-то включить?

...