[WP] Breakin Elements для Breakdance builder

Складчина: [WP] Breakin Elements для Breakdance builder

Экспериментальные элементы для брейк-данса Builder
Этот набор настолько уникален, что некоторые из этих элементов никогда не встречались в других конструкторах страниц.
Раздел Parallax
Это похоже на элемент «Раздел», но с изюминкой: вы можете легко добавить эффект параллакса к фоновому изображению. Сделайте его вертикальным или горизонтальным — всего пара кликов, и готово!
Насколько это потрясающе?
Динамический текст
Добавить динамический текст в Breakdance очень просто, но добавлять динамический текст в середине предложения, как ни странно, совсем не удобно!
С помощью элемента «Динамический текст» вы можете написать целое предложение и добавлять динамический текст в любое место. Их также можно стилизовать и добавлять в качестве ссылок.
Текст скремблирования
Scramble Text предоставляет настраиваемые визуальные эффекты — мерцание, декодирование, расшифровку, скремблирование и стандартный текст — для создания динамичных и привлекающих внимание текстовых отображений.
SVG значок
Элемент SVG-значок — это модифицированная версия элемента «Значок», но вместо того, чтобы добавлять значок в библиотеку «Значков», мы просто вставляем код SVG.
Гораздо удобнее работать напрямую с данными SVG (а не использовать для этого блок кода).
Обведите текст
Создайте идеальный круговой текст и легко анимируйте его с помощью этого потрясающего и невероятно простого элемента


Демо: Скрытая ссылка
Продажник: Скрытая ссылка

Спойлер: На англ.

Breakin' Elements
Experimental elements for Breakdance Builder


This set is so weirdly unique that some of these elements have never been seen in other page builders before.

Section Parallax
It's like the section element, but with a twist : You can easily add a parallax effect to your background image. Be vertical or horizontal, just a couple of clicks and you are done!
How amazing is that?

Dynamic Text
Adding dynamic text in Breakdance is easy, but adding dynamic text in the middle of a sentence is weirdly not convenient at all!
With the Dynamic Text element, you can write a full sentence and add dynamic texts anywhere you want. They can also be styled and be added as links.


Scramble Text
Scramble Text provides customizable visual effects—glitching, decoding, decrypting, scrambling, and standard text—for creating dynamic and eye-catching text displays.
Breakpoint Picture
The Breakpoint Picture element lets us set a different image for each breakpoint and choose a different width, height, aspect ratio and image size.
Thanks to the HTML <picture> tag!


SVG Icon
The SVG Icon element is a modified version of the Icon element, but instead of having to add an icon in the Icon library, we simple paste the SVG code.
It's way more convenient when you work directly with SVG data (instead of using a Code Block for that)


Circle Text
Create a perfect circle text, an animated it with ease with this awesome and incredibly basic element.


Parallax Tilt
A very cool parallax tilt effect made with the Atropos JS lib. I have added more control for the shadows and highlighting effects.
Parallax Tilt Effect

GSAP Loop
Create a looping animation with any element (be it an image, text or anything else) with tons of options, such as translations, rotation, scaling, different effects... it's simply magnificent.


GSAP Parallax Mouse
The parallax mouse effect is a visual technique where different layers of content move at varying speeds in response to mouse movement.

Move your mouse over the picture to see the effect in action ->


GSAP Reveal
Reveal effects are so cool. By using GSAP , we can easily add more options, for more fun.
You can use with with any element, but it works best with text (big headings) and images.

GSAP Split Text
Animate each letter or word of a sentence, with funky animations. Just like the good old Flash animations.
Featuring a Custom Animation engine that will make you spend too much time playing with it.

Split Text Effect
GSAP Stagger
The GSAP stagger element in a container, that works like a DIV (they have the same design options), and each direct child can be animated one by one with a delay.
Which is the most convenient way to animate a group of elements all together.


GSAP Slice Image
Slice an image into a grid and animate each element of the grid using the custom animation engine.
Lots of fun for all the family!!!


GSAP Timeline 3D
The GSAP Timeline 3D element acts as a container, transforming any element into a 3D rectangle, which you can animate in various ways using a timeline.