- ×
New way to see a web page with CSS3 3D transform
Filed under images โบ 3d graphicsShow All๐ท CSS-CAMERA
๐ฅ Demo ยท ๐ Document
Add depth to your web page with CSS3 3D transform.
This project is mostly inspired by Keith Clark's work.
โจ Features
- Movable, and Rotatable camera for your scene.
- Can move to in front of any element in your scene, whether it has been rotated or translated.
โ๏ธ Installation
npm i css-camera # or yarn add css-camera
๐ Quick Start
// Prerequisite: // Create your scene as you like const card = document.querySelector("#card"); const cardButton = document.querySelector("#card-button"); // First, make camera const camera = new CSSCamera("#space"); // Call its method, then update it! cardButton.onclick = () => { camera.focus(card); camera.update(2000); }
Check more methods on the ๐API Documentation page
๐ License