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

       (14 отзывов)

    Евгений Зубов
    • 59 4,25,6,20,3,26,27,28,29 4,6,32 https://creatura.club/uploads/monthly_2016_02/3.12.1_Effekt_prokrutki_-_prozrachnost_(nastroyka_i_parametryi).mp4.f28350faba2bbc83c4c4ce4ba0a578a5.mp4 5 До 5 минут display: none; https://creatura.club/uploads/ Средняя сложность display: none;
      1. Пройдите тестирование для урока
      2. Оцените урок и сдайте задание

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

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

      После выставления маркера в значение 0 пикселей, то есть в самую верхнюю позицию, где он совпадает с верхней границей браузера, это означает, что сразу при загрузке страницы эффект непрозрачности для данного элемента на сайте равно 0 %, для Т-образного маркера выставлено на 100%. Это значит, что при перемещении верхней границы браузера от "Начальной позиции" до "Т-образного маркера" значение непрозрачности для данного графического блока будет изменяться от 0 до 100% при прокрутке страницы. Давайте установим маркер "Окончания действия" эффекта на верхней границе данного графического элемента. В этом значении также будет выставлено 0%, при достижении данного маркера верхней границы браузера, значение непрозрачности должно стать равным 0%. Это значит, что при перемещении в верхней границы браузера от Т-маркера до данного точки значение непрозрачности для данного элемента изменится от 100% до 0%.

      Давайте зайдем в режим "Просмотр" и посмотрим, что получилось. И вы видите, что изначально нашего элемента не видно. Но когда мы начинаем прокручивать страницу в браузере, то картинка плавно появляется. И при достижении расстояния до "Т-маркета", значение непрозрачности для нашего элемента равно 100%. Далее, когда мы начинаем прокручивать страницу вниз, и при достижении верхней границы браузера верхней границе нашего элемента значение непрозрачности снова должно стать равным 0%.Это значит, что наш графический элемент снова должен исчезнуть. Вот таким образом действует эффект непрозрачности для элементов сайта. Перейдем снова в режим "Дизайн" домашней страницы. Например, вы хотите, чтобы ваш элемент не исчезал после того, как он появился.

      Мы выставляем значение конечного положения 100%. Таким образом после прокрутки страницы до "Т-маркера" у нас будет изменяться значение непрозрачности от 0 до 100%, то есть станет видно саму картинку, а далее после того, как верхняя граница браузера прошла "Т-маркер", наша непрозрачность будет изменяться от 100 до 100% процентов, то есть изменяться не будет. Давайте снова зайдем в режим "Просмотр" и убедимся в том, что мы все настроили правильно.

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

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


      Жалоба


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


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

    Это понятно

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


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

    +

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


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

    +1

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


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

    Пройдено

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


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

    Прикольно!

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


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

    Все понятно.

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


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

    Спасибо

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


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

    все понятно!

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


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

    Урок посмотрела. Повторила действия. Все понятно.

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


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

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

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


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

    Понятно.

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


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

×