made with react.js

DIVZ

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

Visit Site

Description

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

"DIVZ is a React component that lets you scroll, swipe and zoom through content on the 3D z-axis–ideal to showcase your portfolio, media or products.

Why Divz? Divz was created to quickly showcase portfolio work within a pseudo-3D environment, loosely inspired by Apple's Time Machine interface which allows the user to zoom through historical Finder windows,

What Sets It Apart?

  • Simplified Integration: Divz is designed to be responsive and easy to use, acting as a straightforward wrapper around a list of divs or other HTML elements.
  • Diverse Applications: While the demos showcase its versatility as a carousel, slideshow, or gallery component, Divz opens the door to a range of other potential uses. Consider it an innovative, experimental method for navigating web content.
  • Broad Device Support: Divz accommodates various navigation modes, including touch for mobile devices, cursor/trackpad for desktop users, and arrow keys for TV devices.

How Does It Work? Under the hood, Divz performs CSS3 transforms on the core component and the child HTML elements, set dynamically with React TypeScript. The component is packaged using Vite to allow npm library integration."


Creator

Lewis Hunt
@Lew_Hunt


Social Media Links

React Open Doodles Utility to use Open Doodle Illustrations
icon-eye-dark Created with Sketch. 572
Cloudscape AWS Design System
icon-eye-dark Created with Sketch. 839
Sentry for React React Application Monitoring
πŸ’™ Sponsored by Friends
We’re hosting on Digital Ocean! πŸ’™ Try it today and get a free $100 credit.
Griffith Web Video Player
icon-eye-dark Created with Sketch. 474
React Minimal Pie Chart Pie / Donut Chart Component
icon-eye-dark Created with Sketch. 79