Редактор Wix Studio: Добавление эффектов мыши

4 мин. чтения
Повысьте интерактивность дизайна с помощью увлекательных эффектов мыши. Добавьте эффект мыши к элементу, который хотите выделить - движение курсора посетителя активирует его автоматически. Мы предлагаем множество различных эффектов, которые вы можете настроить на сайтах ваших клиентов, такие как те, что изображены ниже.  
Примеры различных эффектов для мыши, которые вы можете добавить к элементу в редакторе Studio
Содержание:
Примечание:
Эффекты мыши требуют использование курсора, поэтому они не будут воспроизводиться на устройствах с сенсорным экраном (например, на мобильных телефонах, планшетах и т. д.).

Добавление эффекта мыши к элементу

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

Чтобы добавить эффект мыши:

  1. Выберите соответствующий элемент. 
  2. Нажмите на значок Открыть инспектор  в правом верхнем углу редактора.
  3. Перейдите во вкладку Анимация и эффекты .
  4. Нажмите Эффекты мыши, затем нажмите + Добавить.
  5. Выберите эффект из коллекции.
  6. (Необязательно) Нажмите Настроить анимацию внизу, чтобы настроить такие параметры, как направление, расстояние и переход.
Предпросмотр эффектов мыши в панели Инспектора в редакторе Studio

Настройка эффекта мыши

Выбрав эффект мыши, настройте его так, как вам нужно. Сделайте эффект более уточненным или заметным, выбрав такие настройки, как расстояние, направление, скорость, переход и другие. 
Примечание:
Доступные параметры настройки зависят от выбранного вами эффекта.

Чтобы настроить эффект мыши:

  1. Выберите соответствующий элемент.
  2. Нажмите на значок Открыть инспектор  в правом верхнем углу редактора.
  3. Перейдите во вкладку Анимация и эффекты .
  4. Нажмите на эффект в разделе Эффекты мыши, чтобы отредактировать.
  5. Нажмите Настроить анимацию , чтобы изменить настройки:
    • Направление: выберите, следует ли эффект направлению мыши.
      • По направлению движения мыши: элемент следует за перемещением курсора мыши.
      • Против движения мыши: элемент перемещается в направлении, противоположном курсору. Например, если курсор перемещается вверх, элемент перемещается вниз. 
    • Расстояние: настройте расстояние смещения элемента (в пикс., %, vh или vw).
    • Скорость: перетащите ползунок, чтобы изменить скорость эффекта - чем меньше число, тем быстрее эффект. 
    • Ось движения: выберите перемещение элемента по горизонтали, вертикали или по обеим осям.  
    • Переход: выберите постепенность появления и / или затухания эффекта. 
    • Перспектива: выберите расстояние между элементом и курсором посетителя. В отличие от высокого значения, низкое значение приведет к более интенсивному 3D-эффекту.
Совет:
Активируйте переключатель Для превью подвигайте, чтобы увидеть эффект прямо на холсте, без необходимости просматривать сайт в режиме предпросмотра. 
Настройка эффекта мыши в панели инспектора в редакторе Studio

Удаление эффекта мыши

Вы можете в любое время удалить эффект мыши из панели инспектора. 

Чтобы удалить эффект мыши:

  1. Выберите соответствующий элемент.
  2. Нажмите на значок Открыть инспектор  в правом верхнем углу редактора.
  3. Перейдите во вкладку Анимация и эффекты .
  4. Нажмите на эффект под Эффекты мыши.
  5. Выберите Нет.
Удаление эффекта мыши, выбрав его

Была ли статья полезна?

|