Навигация по приборной панели с помощью jQuery Mobile - PullRequest
Новая
       1

Навигация по приборной панели с помощью jQuery Mobile

9 голосов
/ 07 июня 2011

Я хочу реализовать навигацию в стиле Dashboard в мобильном веб-приложении с помощью jQuery Mobile: http://mobile -patterns.com / dashboard-navigation

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

Заранее спасибо

1 Ответ

6 голосов
/ 07 июня 2011

В этой статье рассказывается о создании пользовательских значков для использования в jquery mobile.Я хотел бы следовать этому для создания своих значков, а затем обратиться к документации navbar jqmobile для получения инструкций о том, как создать список столбцов 3 x 3: 

<div data-role="navbar">
    <ul>
        <li><a href="a.html" class="ui-btn-active">One</a></li>
        <li><a href="a.html" class="ui-btn-active">Two</a></li>
        <li><a href="a.html" class="ui-btn-active">Three</a></li>
    </ul>
</div>

Затем далее в том же самомСтатья представляет собой, Использование сторонних наборов иконок раздел, который объяснит, как добавить в ваши иконки.Так как вам не нужно поле по умолчанию для ваших значков, вы можете добавить еще один класс css к вашему контейнеру div, где вы можете переопределить класс navbar в jquerymobile и скрыть поле: 

<div data-role="navbar hidebox">

Примечание: Когда я работаю с jquery mobile, я импортирую свою собственную таблицу стилей после импорта jquerymobile css.Это позволяет мне переопределять классы, которые jquery mobile внедряет в мой код.Здесь я бы переопределил класс 'hidebox'.

Кроме того, это может помочь при построении сетки 3 x 3 в квадрате , так как этот разработчик делал нечто подобное (язнаете, разработчик использует Sencha Touch, но обсуждения вокруг него могут помочь).

...