WikiSort.ru - Не сортированное

ПОИСК ПО САЙТУ | о проекте

jQuery Mobile
Тип Мобильный фреймворк
Разработчик The jQuery Project
Написана на JavaScript
Последняя версия 1.4.5 (31 октября, 2014 г.)
Состояние Активный
Лицензия Двойная лицензия:
GPL и MIT
Сайт jquerymobile.com

jQuery Mobile — сенсорно-ориентированный веб фреймворк (так же известен как мобильный фреймворк), разрабатывается командой jQuery, создателей jQuery. Разработка сфокусирована на кросс-браузерности с уклоном в сторону смартфонов и планшетов. jQuery Mobile совместим с прочими мобильными фреймворками, такими как PhoneGap, Worklight и другими.

Базовый пример

Первый шаг в работе с jQuery Mobile — подключение JavaScript и CSS файлов. Необходимо подключить jQuery, jQuery Mobile JavaScript и jQuery Mobile CSS. Это можно сделать двумя способами: скачать все необходимые файлы и подключить их локально, либо использовать онлайн-подключение библиотек.

В теле примера вы можете видеть div-ы с различными параметрами data-role. На основе этих параметров jQuery Mobile и создает страницу. data-role указывает на роль элемента на экране — это может быть и страница (data-role="page"), кнопка (data-role="button"), список (data-role="listview") и т. д. Страница (data-role="page") может содержать в себе три div-a с ролями header (data-role="header"), footer (data-role="footer") и content (data-role="content"). От роли элемента будет зависеть, как он будет отображаться на экране.

Веб-страница может содержать сколько угодно div-ов с data-role="page", но в таком случае при старте веб-приложения будет показываться та страница, которая была инициализирована первой. Для перехода между страницами используйте ссылки с href="#id", где id — уникальный идентификатор страницы, на которую вы хотите перейти

Атрибут data-theme определяет стиль интерфейса для элемента и его потомков, в jQuery Mobile встроено пять стилей, они пронумерованы как a, b, c, d, e.

Атрибут data-add-back-btn создает кнопку Назад для перехода на предыдущий экран

<!DOCTYPE html> 
<html> 
	<head> 
	<title>Заголовок страницы</title> 	
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
</head> 
<body> 

<div data-role="page" id="main" data-theme="a">
	<div data-role="header">
		<h1>Заголовок страницы</h1>
	</div>
	<div data-role="content">	
		<p>Содержимое страницы</p>
		<a href="#second">Вторая страница</a>
	</div>
	<div data-role="footer">
		<h4>Подвал страницы</h4>
	</div>
</div>

<div data-role="page" id="second" data-add-back-btn="true" data-theme="b">
	<div data-role="header" id="header">
		<h1>Пример jQuery Mobile</h1>
	</div>
	<div data-role="content">	
		<p>Пример мультистраничности</p>		
	</div>
	<div data-role="footer">
		<h4>Copyright (c)</h4>
	</div>
</div>
</body>
</html>

Пример события

<script type="text/javascript">
$('#header').live('tap', function(event){
  alert('Вы дотронулись до заголовка второй страницы');
});
</script>

Поддержка мобильных браузеров

Платформа Версия Нативно Phone Gap Opera Mobile Opera Mini Fennec Ozone Net front
0.9 8.5, 8.65 9.5 10 4.0 5.0 1.0 1.1* 0.9 4.0
iOS v2.2.1 B
A
v3.1.3, v3.2
A
A
A
v4.0
A
A
A
Symbian S60 v3.1, v3.2 C C B C B C C
v5.0
A
A

 C
A

 C
A
Symbian UIQ v3.0, v3.1 C
8.65		 C
v3.2 C C
Symbian Platform v.3.0
A
BlackBerry OS v4.5 C C C
v4.6, v4.7 C C C B
v5.0 B
A

 C
A
v6.0
A
A
A
Android v1.5, v1.6
A
A
v2.1
A
A
v2.2
A
A
A*

 C*
A*
Windows Mobile v6.1 C C C C B C B C
v6.5.1 C C C
A
A

 C
A
v7.0
A
A

 C
A
webOS 1.4.1
A
A
bada 1.0
A
Maemo 5.0 B B C B*
MeeGo 1.1*
A*
A*
A*


Ключи:

  • A - Полная функциональность — браузер поддерживает все возможности jQuery Mobile
  • B - Средняя функциональность — браузер не поддерживает некоторых возможностей jQuery Mobile (таких, как анимация)
  • C - Базовая функциональность — браузер поддерживает основные возможности
  • * — Новый браузер, ещё не выпущен, но в стадии альфа/бета тестирования.

(Источник: сайт jQuery Mobile)

История версий

Дата релиза Версия
26 Октября 2010 1.0a1
12 Ноября 2010 1.0a2
4 Февраля 2011 1.0a3
31 Марта 2011 1.0a4
7 Апреля 2011 1.0a4.1
20 Июня 2011 1.0b1
3 Августа 2011 1.0b2
8 Сентября 2011 1.0b3
29 Сентября 2011 1.0 RC1
19 Октября 2011 1.0 RC2
2 Октября 2012 1.2
1 июля 2014 1.4.3 final
31 Октября 2014 1.4.5

См. также

Примечания

    Ссылки

    Данная страница на сайте WikiSort.ru содержит текст со страницы сайта "Википедия".

    Если Вы хотите её отредактировать, то можете сделать это на странице редактирования в Википедии.

    Если сделанные Вами правки не будут кем-нибудь удалены, то через несколько дней они появятся на сайте WikiSort.ru .



    Текст в блоке "Читать" взят с сайта "Википедия" и доступен по лицензии Creative Commons Attribution-ShareAlike; в отдельных случаях могут действовать дополнительные условия.

    Другой контент может иметь иную лицензию. Перед использованием материалов сайта WikiSort.ru внимательно изучите правила лицензирования конкретных элементов наполнения сайта.

    2019-2024
    WikiSort.ru - проект по пересортировке и дополнению контента Википедии