22. Создание мобильного сайта в Adobe Muse с горизонтальным пролистыванием страниц

Автор Andrei Golubev
22. Создание мобильного сайта в Adobe Muse с горизонтальным пролистыванием страниц

вода плюс вы можете создать мобильный макет вашего сайта в горизонтальном пролистыванием страниц в такой вариант наиболее подходит для сайтов которые содержат небольшое количество только основную информацию о компании и контакты для того чтобы создать подобный сайт вам понадобится композиционный видит встроенный в Adobe Muse.

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

Триггер справа появляется целевой объект которому соответствует нажимаем на.

Триггер ниже и у нас изменяется контент справа триггеры будут представлять собой пункты меню навигации ополя целевого объекта будут странице нашего сайта куда мы добавим контентов растяните целевые объекты по размеру страницы сайта и. Удалите контент который в них содержится теперь разместите триггеры вверху страницы напечатать ихних название пунктов в меню навигации и установите заливку цветом если — это необходимо при. Дайте необходимые дизайн в вашем пунктам меню на стандартное состояние и активное так как на мобильном мы не используем два состояния курсор над кнопкой и нажата кнопка мыши я сделаю все мои пункты меню одинакового размера 189 пикселей на 54 для этого я использую панель перспектива я выделяю Trigger иногда панели значение ширины и высоты этого элемента для своего сайта я установлю заливку в браузере жёлтым цветом для того чтобы было видно заливка моя в браузере. Я сделаю прозрачным фон этого виджета я выделил этот виджет и убираюсь заливку как проделаем для каждого пункта. Теперь мы можем добавить контент нашего сайта внутри целевых объектов для этого скопируйте или. Создайте заново необходимые элементы которые вы хотите разместить на мобильном макете сайта и поместите внутрь этой рамки переключиться между страницами вашего сайта. Вы можете нажав на триггер аккомпанемент у нас открывается целевой объект о компании сюда мы добавляем информацию в соответствующую этому пункту давайте так сделаем для каждого пункта иногда при добавление контента например слайд-шоу в данном случае в такой виджет он отображается на всех страницах нашего сайта. Как исправить. Для этого нам нужно открыть панель слои найти наши слайд-шоу вот она сейчас она находится поверх нашей композиции то есть поверх нашего композиционного виджета. Именно поэтому она находится на всех трёх если мы переключаем ся между ними то текст у нас имеется только на главной. А вот, что будет видно в трёх страницах мы этого не хотим поэтому. Мы открываем эту композицию и ищем нашей целевой объект данном случае мы должны ставить на главную страницу приходим. На Триггер главное выделяем соответствующий ему целевой объект и смотрим. Какой объект у нас выделился на панели слои в. Голубой квадратик значит, что — это он этот целевой объект я его раскрою и внутри этого целевого объекта. Я помещу слайд-шоу выделяем слайд-шоу и за квадратик переносим внутрь целевого объекта самого последнего. Теперь если мы. Переключайся на другие страницы этого виджета то увидите исчез и находится только на главной странице. Давайте перенесём контент остальные две страницы сайта при переноса контента внутри этого вида обращайте внимание на то какой элемент у вас выделен в данный момент для того чтобы поместить контент в целевого объекта. Вы должны выбрать именно вот этот целевой объект при нажатии на него появляется рамка вокруг него и также в левом верхнем углу. Вы можете всегда посмотреть элемент сейчас у вас выделен в данный момент целевой объект если я выделю Trigger то здесь появится. Триггер — это очень важно. Так как если вы ставите контент не в тот или например выделив Trigger вы скопировали свой контент. И хотите перенести нажимаю вставить и все эти элементы вставляются внутри триггера сделаем от мира теперь я выделяю целевой объект смотрю, что выделено именно он и теперь уже могу спокойно вставить контент моего сайта вот, что у нас получилось на каждой странице у нас имеется теперь контент изображение тексты после того как вы наполнили страницы вашего сайта контентом необходимо нужные вам настройки этого виджета для этого. Выделите виджет кликнув по нему один раз целиком и нажмите на кнопку в верхнем правом углу появляется окошко настройками этого виджета. Убедитесь, что у вас установлена галочка триггеры сверху чтобы ваши пункты меню всегда находились поверх контента также есть настройка перелистывание. Вы можете её убрать или установить по вашему желанию очень важно установить в разделе переход по горизонтали для того чтобы ваша страница перелистывались по горизонтали наш сайт готов теперь можно посмотреть его на экране мобильного устройства наш сайт загрузился вот так вот он выглядит если мы нажмем на. Следующий пункт. Меню то странице сменятся по горизонтали таким образом также посетители вашего сайта можно перелистывать страницы с помощью жестов пальцем. Вот так вот возможны вариации использовании такого метода к примеру мы можем сделать меню навигации закрепленное на фоновом прямоугольнике по правому краю нашего сайта. Открой мотобум усы посмотрим как.

0 комментариев
0

Читайте также