DIVZ

Description

Scroll, Swipe & Zoom HTML Content on the 3‑D Z‑Axis

Overview

DIVZ is a React component that enables scrolling, swiping, and zooming through content along the 3‑D z‑axis. It’s ideal for showcasing portfolios, media, or products.

Why DIVZ?

DIVZ was developed to quickly present portfolio work in a pseudo‑3‑D environment, loosely inspired by Apple’s Time Machine interface, which allows users to zoom through historical Finder windows.

What Sets It Apart

Simplified Integration – Designed for responsiveness and ease of use, DIVZ acts as a straightforward wrapper around a list of <div> elements or other HTML components.
Versatile Applications – While demos highlight its use as a carousel, slideshow, or gallery, DIVZ can serve many other purposes. It offers an innovative, experimental way to navigate web content.
Broad Device Support – Supports multiple navigation modes: touch for mobile devices, cursor/trackpad for desktops, and arrow keys for TV interfaces.

How It Works

DIVZ applies CSS3 transforms to the core component and its child elements, dynamically set using React with TypeScript. The library is bundled with Vite, enabling seamless npm integration.