Card3d.js

Installation ?

NPM

                
npm i card3d
                
            

CDN

                
https://unpkg.com/[email protected]/dist/card3d.js
                
            

Import

                
const Card3d = require("card3d");
import Card3d from "card3d";
import "card3d";
                
            

Without attributes in JS

                
//all attributes can ba placed as configuration (data-card3d-delta="0.8" -> delta: 0.8)
const card = new Card3d(
    document.querySelector('.card'), 
    { glare: 0.7, glareOpacity: 0.7 }
);

//methods
card.updateConfig(newConfig);
card.stop();
card.start();
                
            

Simple example

HTML

Simple example with glare

HTML

Simple example with other perspective and delta

HTML

Simple example reversed

HTML

Simple example with no reset

HTML

Simple example with full page listening

HTML

Simple example with scale

HTML

Simple example with start X and Y

HTML

Simple example with axis

HTML

Use device orientation on mobile (only android)

HTML

How to stop

HTML