В предыдущей заметке, мы уже рассматривали с вами варианты анимированных эффектов для блоков Mobirise. Сегодня, рассмотрим готовое решение, которое позволяет использовать несколько готовых блоков с интересной анимацией при скролле (прокрутке) страницы на основе CSS.
Примечание. На версиях Mobirise 5 и выше, при установке данного дополнения, могут возникнуть трудности при редактировании многоуровневого меню на сайте.
На сайтах с обычным меню
не было замечено проблем. Также, данное расширение, не вызывает никаких проблем с использованием многоуровневого меню в программе Mobirise 4-й версии. В любом случае, всегда создавайте резервные копии профиля и проектов в Mobirise. Аналогичная проблема с меню, наблюдается и при использовании блоков из данной заметки.
Анимация при прокрутке (скролле) страницы в Mobirise.
Решение доступно в виде дополнения для Mobirise. Автор данного расширения, предоставляет к нему свободный доступ.
Заходим на официальную страницу «Animation on Scroll»: https://casper55.ru/animated-on-scroll/
Нажимаем «Download» на странице расширения «Animation on Scroll» для Mobirise:
После загрузки, добавляем расширение в Mobirise. После добавления, открываем проект и ищем в блоках, новое расширение «Animation on Scroll»:
В своем примере, выберу блок «Header»:
Открываем Настройки/Параметры блока:
В открывшейся вкладке, раскрываем выпадающий список напротив параметра «Fade» («Fade Animation») и выбираем подходящую анимацию для блока.
Учтите, что эффект, виден только при прокрутке страницы. Поэтому, прокрутите страницу вверх/вниз, чтобы увидеть результат анимации при скролле страницы.
Данное расширение анимации при скролле, добавляет 7 готовых блоков, которые можно использовать и настраивать для своего проекта.
Перед любыми изменениями, всегда создавайте резервные копии Mobirise и чистите кэш браузера, когда проверяете результат в браузере.
Если появятся битые ссылки, или возникнут вопросы и дополнения... Оставляйте комментарии.