Перейти к содержимому
  • Что такое эффекты прокрутки

       (15 отзывов)

    Евгений Зубов
    • 56 4,25,6,20,3,26,27,28,29 4,6,32 https://creatura.club/uploads/monthly_2016_02/3.11.1_CHto_takoe_effektyi_prokrutki.mp4.984f41685489901252e2cd12dd28c764.mp4 7 До 10 минут display: none; https://creatura.club/uploads/ Высокая сложность display: none;
      1. Пройдите тестирование для урока
      2. Оцените урок и сдайте задание

      В этом видеоуроке мы познакомимся с эффектами прокрутки в программе Adobe Muse. Заходим в программу и создаем один графический блок. Сделаем ему заливку картинкой логотипа digitalmakers.ru Эффекты прокрутки относятся к анимационным эффектам программы, когда 2 или более слоев содержимого перемещаются в браузере с разной скоростью. Этот прием позволяет задавать для каждого элемента собственную скорость и направление перемещения, позволяя создавать эффект параллакса. Эффекты прокрутки находятся в правой панели программы на закладке "Эффекты прокрутки".

      Эти эффекты можно применять к любым прямоугольникам, созданным в программе, а также к текстовым фреймам. Кроме того в программе можно задавать эффекты прокрутки для фона. Для конкретных графических элементов, блоков, прямоугольников и текстовых фреймов задается через меню "Эффект прокрутки" в правой панели. Здесь мы можем поставить галочку "Перемещение" и осуществить настройки для данного эффекта. Также в программе можно задавать эффекты прокрутки для фона изображения. Для нашего созданного прямоугольника нужно зайти в меню настроек данного прямоугольника, в "Заливку", и здесь есть закладка "Прокрутка".

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

      Эффекты прокрутки можно применять в меню "Заливка" в браузере. Если мы сейчас снимем выделение с данного элемента и нажмем на пустом поле, то у нас появится в меню "Заливка" в браузере. И если мы зададим изображение для заливки в браузере, то при использовании заполняющего изображения нам также будут доступны эффекты прокрутки для него. Здесь мы можем осуществить все те же самые настройки, что и для других элементов. Для перемещения самого изображения заливки браузера при прокрутки страницы. При этом очень важно, что эффекты прокрутки можно применять к заполняющим фоновым изображениям, для которых заданы значения либо "Мозаика", либо "По размеру", либо "Исходный размер", либо "Заполнение", то есть первые 4 значения.

      Также эффекты прокрутки, примененные к элементам заполнения фона, не удастся применить к объектам, к которым применены определенные графические эффекты. Например, если сейчас выделим графический блок и зайдем в "Эффекты", то при применении эффектов "Скос" и "Свечение" на панели "Заливка" будут недоступны параметры прокрутки. Также перед применением эффектов прокрутки для блока в целом необходимо убедиться, что данный эффект выделен и стоит состояние "Стандартное". Далее при работе с эффектами прокрутки необходимо знать значение 3 понятий: "Исходная позиция", "Начальное перемещение", "Конечное перемещение". Все эти параметры настраиваются для любого эффекта прокрутки.

      Давайте включим перемещение для данного блока, переместим его немного вниз, и вы видите, что у нас появился "Т-образный маркер". Значение положения этого маркера находится в эффектах прокрутки. Сейчас маркер находится на расстоянии 63 пикселя от верхнего окна браузера. Это значит, что расстояние от самой верхней линии до линии начала маркера составляет 63 пикселя. Этот маркер означает исходную позицию. Следующий параметр - "Начальное перемещение" и "Конечное перемещение". В каждом из этих параметров есть настройки направления перемещения: если значок темный, то это направление включено, а если светлый значок , то значение выключено. Сейчас включено перемещение вверх и вправо.

      Перемещение вверх установлено 0, а вправо - 1. Эти цифры означают скорость перемещения по вертикали и по горизонтали соответственно. Значение начального перемещения работает до того времени, пока верхняя граница окна браузера коснется данного "Т-образного маркера", а значение скорости представляет собой множители скорости перемещения. 1 означает то, что наш объект будет двигаться точно с такой же скоростью, как прокручивается страница в браузере. Если это значение будет больше 1, то наш объект будет перемещаться во столько раз быстрее, чем прокручивается страница в браузере. Если установлено значение 0, то объект не будет перемещаться.

      Значение параметров "Конечного перемещения" работают после того, как верхняя граница браузера дошла до "Т-образного маркера" нашего элемента. То есть после того, как верхняя граница окна браузера коснулась данного элемента, начинают работать параметры "Конечного перемещения". Наш объект может перемещаться вверх со скоростью 1 или 1.5 или если мы установим 0.5, то он будет перемещаться в 2 раза медленнее относительно прокрутки страницы в браузере. И еще раз о параметрах перемещения: "Начальное перемещение" отвечает за перемещение объекта до того момента, как верхняя граница окна браузера коснется "Т-образного маркера" для данного объекта.

      "Т-образный маркер" отвечает за расстояние от верхней границы окна браузера до расположения данного маркера. "Конечное перемещение" отвечает за перемещение объекта после того момента, как верхняя граница окна браузера коснулась данного "Т-образного маркера" при прокрутке страниц. На этом урок закончен. В нем мы познакомились с основными эффектами прокрутки и их параметрами в программе Adoobe Muse. Вам необходимо будет выполнить задание, ответить на вопросы и переходить к дальнейшему обучению.

    Вы познакомитесь с эффектами прокрутки. Эта одна из технологий которая способна сделать из Вашего сайта что-то действительно интересное и уникальное. 


      Жалоба


    Отзывы пользователей


    Слава Баранов

    Не понял. К практике

    Поделиться отзывом


    Ссылка на отзыв
    Genka

    +

    Поделиться отзывом


    Ссылка на отзыв
    Юлия+Коваль

    +1

    Поделиться отзывом


    Ссылка на отзыв
    Гость Падалко Сергей

    Познается на практике

    Поделиться отзывом


    Ссылка на отзыв
    Дмитрий Жуков

    очень сложно!

    Поделиться отзывом


    Ссылка на отзыв
    Алексей

    Грамотно.

    Поделиться отзывом


    Ссылка на отзыв
    Андрей А

    Очень интересно!

    Но, интересно посмотреть на результат.

    Поделиться отзывом


    Ссылка на отзыв
    Валерий1234

    Спасибо

    Поделиться отзывом


    Ссылка на отзыв
    YanaZamkova

    спасибо! очень нравится этот эффект!

    Поделиться отзывом


    Ссылка на отзыв
    Sharovich

    Всё понятно. Спасибо.

    Поделиться отзывом


    Ссылка на отзыв
    gladir1

    Посмотрела, Понятно

    Поделиться отзывом


    Ссылка на отзыв
    7dgoni6

    Понятно.

    Поделиться отзывом


    Ссылка на отзыв

×