GSAP

This page is animated by Greensock GSAP

CSS Border Radius

BB Photo module

La corde
La corde

BB HTML module

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

CSS Mask

BB Photo module

La corde
La corde

BB HTML module

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Columns layout with CSS Flexbox

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Columns layout with CSS Grid

Heading
Custom field value
Heading
Custom field value
Heading
Custom field value
Heading
Custom field value
Heading
Custom field value

HTML markup

Custom CSS

Toggle element visibility from a button

La corde

BB elements

Set custom classes on:

  • The toggler button: av-visibility-toggler
  • The target element to change visibility on: av-visibility-target

Let the button's label empty in the module UI, it will be dynamically set by the JS ("Show/Hide Element").

Custom CSS

Custom JS

PowerPack Flip Box with image only (face & back)

1313.jpg

Titre en avant

Description en avant

PP Flip Box module Settings

  • General tab: Icon Type > Image (face image)
  • Back Content Tab: Insert an image in the Content field (back image)

Custom CSS