Card 01 / beta 0°

Rotator demo

Five ordinary HTML cards are placed under each other. Each card has its own 3D rotation and the scroll handler moves the camera from one perpendicular view to the next.

Card 02 / beta 20°

Twenty degrees

This card is rotated by 20 degrees. While scrolling, the camera transitions to the opposite angle, so the card becomes front-facing again.

20°
Card 03 / beta 40°

Forty degrees

The rotation increases in a strict multiple of 20 degrees. The camera state follows the same sequence in reverse direction.

40°
Card 04 / beta 60°

Sixty degrees

The engine keeps the page as a normal browser layout while the visual presentation is controlled in 3D space.

60°
Card 05 / beta 80°

Eighty degrees

The final scroll state turns the camera to the last card and gives it the same perpendicular treatment as the first one.

80°