Premium element

ShowCase

Rotating Cards

Rotating Cards animates card elements within a specified container, creating a dynamic visual experience by cycling through different rotation animations. The effect supports multiple rotation types and speeds, making it customizable for various use cases.

Preview

Card 1

Description

Card 2

Description

Card 3

Description

Quick Setup

data-rotating-cards-container=true

Required

Sets up the container that holds the rotating cards. This attribute must be present on the parent element for the effect to work.

data-rotating-card=true

Required

Marks each card element inside the container to participate in the rotation animation. All child elements with this attribute will be included in the effect.

Rotation type

data-rotation-type="preset-name"

Optional

flip

fade

slide

zoom

Advanced configuration

data-rotation-speed

Optional

Specifies the speed of the rotation animation in seconds.

Default: 1.5

data-rotation-interval

Optional

Sets the time interval (in milliseconds) between each card rotation.

Default: 4000

We're here to help

Choose how you'd like to connect with our support team

Contact Support

Get help from our team of experts

Response within 24 hours