Выберите «Файл» > «Создать».
Последнее обновление
27 апр. 2021 г.
Интеграция Dreamweaver с jQuery Mobile позволяет быстро создавать веб-приложения, которые работают на большинстве мобильных устройств, адаптируясь к их размерам.
Создание веб-приложения с помощью jQuery Mobile
Откройте начальную страницу jQuery Mobile или создайте страницу HTML5
Используете начальные страницы jQuery Mobile в Dreamweaver, чтобы создать приложение. Вы также можете начать создание веб-приложения с новой страницы HTML5.
На начальных страницах jQuery Mobile имеются файлы HTML, CSS, JavaScript, а также графические файлы, позволяющие быстро приступить к разработке приложения. Вы можете использовать файлы CSS и JavaScript, размещенные на CDN, на собственном сервере или файлы, установленные вместе с Dreamweaver.
Примечание
Чтобы узнать, где расположены связанные файлы, см. теги <link> и <script src> в представлении кода.
Вставьте компоненты jQuery Mobile из панели «Вставка»
Вставьте компоненты jQuery Mobile из панели «Вставка» на HTML-страницу. Файлы jQuery Mobile CSS и JavaScript определяют стиль и поведение компонентов.
Сведения о CDN и локальных файлах jQuery Mobile
CDN
CDN (сеть доставки содержимого) является компьютерной сетью, в которой содержатся копии данных, размещенные в различных точках сети. При создании веб-приложения с помощью URL-адреса сети CDN для приложения используются файлы CSS и JavaScript, указанные в этом URL-адресе. По умолчанию Dreamweaver использует сеть CDN jQuery Mobile.
Кроме того, вы также можете использовать URL-адреса сетей с других сайтов, например Microsoft и Google. Измените расположение сервера с файлами CSS и JavaScript, указанными в тегах <link> и <script src>, в представлении кода.
Файлы, загружаемые из сети CDN, доступны только для чтения.
Локальные файлы jQuery Mobile
При установке Dreamweaver копии файлов jQuery Mobile переносятся на компьютер. HTML-страница, которая открывается при выборе начальной страницы jQuery Mobile, связана с локальными файлами CSS, JavaScript и графическими файлами.
Начальные страницы jQuery Mobile
В Dreamweaver имеются следующие начальные страницы для создания веб-приложения:
jQuery Mobile (CDN)
Используйте эту начальную страницу, если библиотеку jQuery Mobile планируется разместить в сети CDN.
jQuery Mobile (локальный)
Используйте эту начальную страницу, если ресурсы планируется размещать на собственном компьютере либо если приложение не использует подключение к Интернету.
jQuery Mobile (PhoneGap)
Используйте эту начальную страницу, если веб-приложение при развертывании в качестве приложения для мобильного устройства использует собственные функции мобильного устройства. Дополнительные сведения см. в разделе Упаковка веб-приложений.
Используйте начальные страницы для создания приложения для мобильных устройств.
Выберите один из следующих пунктов, исходя из своих потребностей:
«Страница из образца» > «Начальные страницы Mobile» > «jQuery Mobile (CDN)».
«Страница из образца» > «Начальные страницы Mobile» > «jQuery Mobile (локальный)».
Нажмите кнопку «Создать».
На открывшейся странице установите флажок «Следовать ссылкам непрерывно» («Вид» > «Параметры интерактивного просмотра») и переключитесь на интерактивный просмотр. Используйте компоненты навигации, чтобы проверить, как работает приложение.
Чтобы посмотреть, как страница отображается на устройствах разных размеров, воспользуйтесь командами из меню «Многоэкранный». Отключите интерактивный просмотр и перейдите назад в представление дизайна.
На панели «Вставка» («Окно» > «Вставка») выберите jQuery Mobile. Будут отображены компоненты, которые можно добавить в веб-приложение.
В представлении дизайна поместите курсор в то место, куда требуется вставить компонент, а затем щелкните компонент на панели «Вставка». В открывшемся диалоговом окне настройте компоненты с помощью параметров.
(jQuery Mobile — локальный) После сохранения HTML-файла файлы jQuery Mobile, включая графические файлы, будут скопированы в папку, где находится HTML-файл.
Просмотрите страницу в режиме интерактивного просмотра. Некоторые классы CSS применяются только в режиме интерактивного просмотра.
Создание веб-приложения для мобильных устройств с новой страницы
Компонент «Страница» является контейнером для всех остальных компонентов jQuery Mobile. Перед тем как вставлять другие компоненты, добавьте компонент «Страница».
Выберите «Файл» > «Создать».
Выберите «Пустая страница» > «HTML».
Некоторые компоненты jQuery Mobile используют атрибуты HTML5. Чтобы обеспечить соответствие HTML5 во время проверки, необходимо выбрать HTML5 в качестве DocType.
На панели «Вставка» («Окно» > «Вставка») в меню выберите jQuery Mobile. На панели появится компонент jQuery Mobile.
Перетащите компонент «Страница» в представление дизайна из панели «Вставка».
В диалоговом окне «Файлы jQuery Mobile» выберите один из следующих параметров.
Удаленный (CDN)
Если требуется подключиться к удаленному серверу CDN, на котором размещены файлы jQuery Mobile. Используйте параметр сайта jQuery по умолчанию, если сайт с файлами jQuery Mobile задан не был. Также можно использовать другие серверы CDN.
Локальный
Будут отображены файлы, которые доступны в Dreamweaver. Чтобы указать другую папку, нажмите кнопку «Обзор» и перейдите в папку, в которой находятся файлы jQuery Mobile.
Файлы CSS и JavaScript копируются в локальный временный каталог, пока HTML-файл не будет сохранен на компьютере. После сохранения HTML-файла все связанные с ним файлы jQuery Mobile и графические файлы копируются в папку, расположенную в корневой папке сайта.
Введите свойства компонента «Страница».
В представлении дизайна поместите курсор в то место, куда требуется вставить компонент, а затем щелкните компонент на панели «Вставка». В открывшемся диалоговом окне настройте компоненты с помощью параметров.
Просмотрите страницу в режиме интерактивного просмотра. Некоторые классы CSS применяются только в режиме интерактивного просмотра.
Использование пользовательских файлов и папок
Для приложения можно создавать собственные файлы CSS и JS. Файлы должны иметь имена jquery.mobile.js, jquery.mobile.css и jquery.js
При использовании пользовательских папок выполните следующие действия.
Загрузите необработанную версию базовой библиотеки jQuery 1.5 с веб-сайта http://docs.jquery.com/Downloading_jQuery#Download_jQuery.
Сохраните файл в корневой папке, содержащей другие ресурсы.
Создание красивых веб-сайтов в Dreamweaver
Создавайте дизайн, пишите код и управляйте динамическими веб-сайтами с помощью многофункционального инструмента.
