Триггерная анимация в Тильде
Vložit
- čas přidán 28. 08. 2024
- Сайт из описания: ivangoncharov....
Мой обучающий курс по работе в Tilda dolginstudio.c...
Лонгрид Тильды: tilda.cc/ru/lp...
Хотите сайт на Тильде? Мы можем помочь: dolginstudio.com/
Хотите поддержать проект? donatty.com/do...
Хотите 1 месяц в подарок после первой оплаты за Тильду? Регистрируйтесь по ссылке tilda.cc/?r=14...
Тильда слишком дорого? Попробуйте Craftum craftum.com/id...
Хотите покупать фотографии со стоков дешево? Вам сюда: shopdiz.pro/r/...
В инстаграм посты выкладываю редко, и не про дизайн, но если интересно- / germandolgin
Все супер, но вот когда переводишь курсор с шейпа на текст есть маленький баг, анимация на доли секунды начинает с начала воспроизводиться, то есть как будто происходит разовое моргание
Для решения этого вопроса все покрывается одним прозрачным шейпом который и является триггером для обоих объектов
@@germandolgin спасибо, у меня тоже прыгала кнопка, ничего не мог сделать. Сделал прозрачный шейп и все заработало!!!
@@germandolgin есть вариант с текста отключить pointer events. Работает без костылей)
@@-Stand-Alone-Complex ЭТОТ вариант рекомендовал Макс Ширко на Тильде еще пару лет назад
очень подробно и понятно спасибо. Полезная возможность
Класс, спасибо, полезный контент) Запускай свой курс по Тильде, многие пойдут к тебе))
Поддерживаю!!! )))
Герман, Вы Учитель от Бога!!!!! Тыща миллион до неба лайков и (так как я уже на Вас подписана), подписывают на ВСЁ! Счастья и процветания Вам. 🤩👍✨
2 дня сидела, не могла понять,что фоновая фотка нужна. Спасибо тебе огромное, дружище!!!! Успехов тебе в творчестве!!! Ждём от тебя новых полезностей
Очень полезная информация! Спасибо за ваш труд 🙌🏼
Герман, Вы молодец! Спасибо за этот контент и не только. Последнее время качество канала скакануло на порядок. Так держать!
Фишка огнь, буду использовать для портфолио )) вместо шейпа применила кнопку, чтобы не замарачиваться с отдельными анимациями текста и шейпа. Очень нравятся твои сайты🔥
Большое спасибо за разбор! Очень помогли!
Спасибо! Очень внятно, сразу получилось ! СУПЕР !!!!!!!!!!!!!!!!!!!!!!!!!!
Герман спасибо!Загружай любую полезную инфу.
Спасибо, Герман! Круто объяснил. По-больше бы таких необычных видосов по зероблоку Тильды.
Спасибо огромное за урок всё очень понятно обьясняете, у меня всё получилось сделать 👍
Здравствуйте, спасибо за видео!!!
Благодарю. Очень полезно, сделала - работает
Герман, всё доступно описал! Спасибо!!!
Герман красавчик!!! Выручил меня, ты бы знал как!!! Благодарность тебе великая!!!
Благодарю за отличную идею!
Круто, все понятно, подробно и доступно объяснил. Спасибо!!!
отлично объяснили, спасибо большущее!😄
Очень круто, и понятно, спасибо, разобрался, до этого триггерило меня а не анимацию
Спасибо большое за видео, все четко и понятно👍
Большое спасибо за ваши видео, Герман!
Спасибо! Очень внятно, сразу получилось). Но вот вопрос - а как решить задачу демонстрации для остальных экранов кроме десктопа?
Самое понятное видео по анимации и тригерам
Очень полезно.Спасибо.
Супер! я такого не встречала еще
Очень круто!!! Спасибо, искала как реализовать эффект и нашла тебя!! Спасибо! Все четко, по делу и понятно!!!
Супер! спасибо за урок!
Спасибо 😍
Дай Бог тебе здоровья, добрый человек!))) Обалденный урок!! Спасибо огромное! Я новичок и мне такие видео очень нужны!
Супер полезно, огромное спасибо 👍
Спасибо
Ну наконец то я нашел как делать этот эффект правильно! Он теперь и адаптивный должен быть под разные мониторы. Спасибо!
Пробовал под мобилу делать?
@@staslev1 если в настройках страницы отключить оптимизацию под мобилы то он все показывает как на десктопе, и анимации работают по нажатию. Но в моём случае я сделал отдельные блоки под мобилу и там уже без анимации. Моя проблема была в расположение не по гриду а по окну, и в переключении в проценты.
VovaSumrak Я новичок в этом.
Я понимаю что на мобиле по нажатию, но что про оптимизацию? Что то не понял.
Кинь номер , если не сложно.
Привет! Классный урок! На этом сайте есть еще крутые элементы, было бы круто что и их показал как делать!! Ты нереально крутой!!!
Герман отличный контент, видно экспертизу в этом деле, спасибо за доступность.
Интересное решение 🤝 Можно было бы продолжить с адаптацией этого фарша под мобилу😉
Спасибо Герман. Хоть все это знаем сто раз, но смотреть и слушать очень приятно (особенно мысли) И побольше вот таких видео где показана работа в Тильде:) У меня такой вопрос кстати. По какой причине нельзя Alt тег прописать у шейпа?)
Подписался только за это видео! Спасибо! Круто! Хочется еще разборов подобных вариантов анимаций сайтов! ))
спасибо
Герман, узнал о тильде дня 4 назад, короче все понятно и просто. Мне 26 лет, думаю заняться сайтами, начну со своего))) потом как сделаю, пришлю тебе, много интересного увидел в твоём видеоряде (особенно в сайтах твоих подписчиков). Творческих успехов, бесконечного запаса креатива и жизненных сил!
Я залипла на сайте на плюсики, скатывающиеся вниз))
Спасибо, за 15 минут освоил триггерную анимацию
Благодарю! Как раз для моего заказа!
Спасибо большое. Очень полезное видео. Ждём ещё)
Жаль нельзя поставить больше одного лайка, респект Герман :)
Благодарю за урок!
Расскажите пожалуйста про домены, когда сайт заказчика завершаешь и чтобы после этого не было никаких вопросов и проблем про домен!
Очень полезный видос! Благодарен)
Спасибо!..от души!
Супер. Спасибо 😃
Спасибо!!! Офигенно👍
Класс!!!
Чувак, спасибо что так разжовиваешь!!! Ты красавчик!!! 😄 🦾
Лучший)
Бонжорно) а возможно сделать при скроле чтобы кнопки убегали в сторону и появлялись с другой стороны?????
Герман, ты лучший))) Кроме тебя есть смысл смотреть только Макса Ширко (ИМХО)!!!
Спасибо огромное!!!Лайк+Подписка!
сначала разобрался с анимацией, потом посмотрел видео, не ищу лёгких путей
Добрый день! Спасибо за подробный урок, все получилось. только вопрос, при таком размере карточек- в мобильной версии все криво. как настроить мобильную версию?
Спасибо огромное)
А можно сделать полную копию варианта тильды? Есть вопросы по этому варианту. Не могу понять как сделать то бы не прыгал текст и адаптивно работал под разные мониторы.
Спасибо! 👍 нравится пошаговое разъяснение для чайников 😅 то , что нужно) расскажи, как ты прокачиваешь знания? Проходишь курсы или может по статьям Тильды учишься?
а почему не показали как сделать текст под каждым выпрыгивающим блоком??? я так ждала((
Супер, сразу стало ясно ,что это за триггер такой
Герман, спасибо за такой классный подробный урок. А возможно выставить эти кнопки по виндов конейнер. Если можно подскажите пожалуйста где какие настройки заменить. Заранее спасибо!!!
Пушка ракета торпеда, спасибо
Герман ,добрый день.Как сделать чтобы при наведении курсора на шейп кроме появления соответствующей картинки и анимации шейпа,этот шейп становился кликабельным для перехода на другую страницу?
Очень круто! А как сделать анимацию кривой линии (стрелки) по скроллу? Чтобы не прерывисто, а оставался след. Подскажите, пожалуйста 😢
Герман, а под мобильник нельзя сделать подобное? Есть 5 кнопок, при нажатии на каждую смена фото. Почему триггером не корректно работает. То меняет фото , то нет
Классно! Спасибо))
Подскажите пожалуйста такой момент. Когда вставляешь картинку в зеро блок или через шейп, она полностью перекрывает видимость рабочего поля. Не понятно как вообще ее выравнивать относительно устройства? Даже если убираешь ее в самый нижний слой, рабочее поле не видно все равно. Как быть?
Оч круто).. есть вопрос - как сделать так, чтобы в пяти разных вариантах показа картинки были 5 разных текста?
Всё замечательно, но можно же копировать свойства анимации и вставлять на другой элемент.
Спасибо!!!
Подскажите, откуда у вас дополнение в настройках - Trigger? У меня такого нет.
спасибо большое, а это еще можно сделать кнопками с переходом на другую страницу?
назначение ссылок не отражается на анимации, так что можно
У кого происходит дрожание при переводе курсора с шейпа на текст, отключите у текста pointer events (none).
🤘 я просто вспомнил, как я это все на JS писал 😅😅😅
Привет, можешь подсказать, как реализована анимация в блоке "Услуги, виды деятельности фотографа". Вопрос конкретно такой: Как сделать так, чтобы карточка при скролле появлялась одновременно вся, то есть со всем содержимым (фотографиями, текстами и кнопками). Или это готовый блок? Спасибо :)
Спасибо. Ещё анимацию.
Какое должен быть разрешение изображения
для нормального отображения в Zero Block
Герман а можешь снять видео как сделать качественную обложку для интернет магазина в Заро блоке , думаю многим зайдет видео !
спасибо. полезно!
Спасибо, очень крутая задумка!
но вот у меня проблемка: когда навел на блок все работает - нужная картинка в 100 появляется , но когда наводишь на текст внутри блока то картинка опять в 0 и снова в 100! то есть анимация на картинке запускается с 1 шага при наведении на текст внутри
Все прекрасно, видео понятное и полезно. Но забыл уточнить ОГРОМНУЮ проблему - если загружать фото через shape - они хуже загружаются, чем если бы через Image. Столкнулась с этим в работе с клиентами - и теперь много негатива с их стороны(( Приходится все менять, обрезать и уменьшать вес - потому что с Shape - реально очень плохо загружается. Даже Сейчас посмотрела сайт для фотографа, который в описании - та же проблема
У меня, возможно, глупый вопрос...а во сколько тебе обходится использование Тильды? Ведь ресурс не бесплатный
А кнопки из них можно сделать?(навел на "свадьбы" -увидел фото- нажал и перешел к другому разделу(например,оплата)
Кстати, смотрю на скорости х1,5))))))
Скажите, тригерна работает на мобильных?
Классно, сними пжл вторую часть по адаптации к мобильным версиям данного блока.
Герман, на этом сайте стоят не релевантные ссылки на желтых прямоугольниках в мобильной версии: верхний (над свадьбами) переход на концерты, нижний (студийная) переход на контент съемку. Думаю, прямоугольники выполняют декоративную функцию, а ссылки попали туда случайно.
Ника огромное вам спасибо как всегда 👍))
Спасибо за материал! скажите, пожалуйста, как это будет работать для мобильной версии - анимация по наведению. пробую делать триггерную анимацию, чтобы при наведении появлялась подложка и текст над объектом, но в мобильной версии не работает. просто накладывается объект сверху, как в макете
Ну во первых на мобилке надо включить анимацию, насколько я помню на мобилке автоматически меняется триггер с наведения на нажатие в таких ситуациях, не забудьте включить и тогда посмотрите
@@germandolgin затупила) спасибо)))
Здравствуйте. Вы так быстро рассказываете, и не все показываете что не возможно научиться новичку((( уже час пытаюсь повторить Ваш опыт и ничего не получается, не могу найти где находятся все слои(( у меня в анимации нет добавить триггеры как у Вас((( нужно намного подробнее и медленнее(((
В зеро блоке в правом верхнем углу нажмите на три точки и включите слои. Там будет написано layers. Может быть другие мои видео по анимации покажутся вам попроще
привет. расскажи пожалуйста как с 0 сделать кодом красивую галерею с работающими кнопками на каждом слайде
Она же есть и так (слайдер)
Можно пожалуйста многостраничный сайт
Drummers ftw!
Ребят кто-нибудь скажет, почему когда я стравляю картинку или любой элемент на вес холст, то автоматический оставляет отступить по бокам?
он ставится в грид контейнер, перенесите его в виндоу контейнер
Я ставлю в виндоу контейнер, но нечего не меняется
Номер блока ?
Герман привет ) смотрю твои видео , и многое для себя открыл возможностей в них.Но одного, вроде простого момента, ни как не повторить. Подскажи как это сделано ? Анимация на витрине проектов с изменением цен и корректной ее работе при клике. wood-brus.ru/doma-iz-brusa
Заранее спасибо)
Герман привет меня зовут Сергей. Спасибо за видео . Классная идея. А как можно сделать чтобы при нажатии на кнопку "снимаю свадьбы" внизу ещё выпадало меню из 5 пунктов ?
Сделаю видео отдельно. Идея-то супер для видоса
@@germandolgin у многих не раскрыта тема с многоуровнем меню. Классное многоуровневое меню у сервиса для интернет магазинов эквид.
@@terekhov83 Имхо с точки зрения юзабилити многоуровневое меню это супер неудобно.
@@germandolgin czcams.com/video/aluJXukM5CM/video.html
@@terekhov83 Да это как бы и несложно, просто неудобно использовать. Когда встречаю такое в интернет магазинах думаю что они издеваются