https://mo-ti.ru/button-effects2
https://romanyu.ru/skroll-strelki
https://romanyu.ru/nalozhenie-bloka-pri-skrolle
https://roman-kosov.ru/autocomplete-tilda-cart
https://necodim.ru/tilda/login-block-show-hide
Zero Block
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
Инструкция

  1. Добавляем в zero-блоке шейпы, изображения или кнопки, к которым у нас будет применяться скругление. В редакторе скругление этих элементов можно оставить со значением 0
  2. Задаем классы этим элементам (щелчок правой кнопкой мыши по элементу — Add CSS Class Name), в моём примере это класс squircle24, так как скругление углов равно 24px.
  3. Копируем код в блоке ниже и ориентируемся по комментариям внутри него: !!! Если у вас многостраничник, и вы будете использовать скругление на разных страницах. то лучше код, который помечен как для вставки в head, поместить в Настройки сайта — Еще — HTML код для вставки внутрь Head. Либо в header сайта, если он общий на все страницы. !!! Если у сайта одна страница, то код можно использовать на текущей странице целиком
  4. Можно использовать для отдельных элементов свой радиус скругления, для этого просто скопируйте все нужные строчки между тэгами <style></style>, вставьте ниже и пропишите новое название класса и также нужный радиус скругления.
  5. Использование кода суперэлипса для стандартных блоков ничем не отличается от кода с обычным скругление блоков, вы также берете класс из таблицы на этой странице и прописываете вместо того кода всё, что в пункте 4 между тегами style.
  1. Добавляем в zero-блоке шейпы или изображения, которые у нас будут вариантами ответа, сколько вариантов, столько и шейпов
  2. Задаем классы этим шейпам. Верный ответ — класс dragtrue, неверный — dragfalse
  3. Создаем область, куда будем перетаскивать наши варианты ответа, это также может быть шейп или изображения, задаем ей класс drag-container
  4. Попапу, который должен появится при перемещении правильного ответа в область задаем класс uc-popuppromocode
  5. Также в моём примере появляется верный вариант ответа, это отдельный шейп, у которого класс true-answer, и кнопка при нажатии на которую открывается повторно попап с промокодом, у которой класс promocode
В коде прописаны дополнительные комментарии, по которым вам будет проще ориентироваться, также есть дополнительная таблица, с помощью которой можете немного расширить функционал кода
Zero Block
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
LET'S GO!