aboutjax / framer-flip-card-module

A framer module to quickly create a flip card effect with two image layers

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

What does it do?

The function flipCard.flipCard() will take in four parameters

  1. Front image layer
  2. Back image layer
  3. Perspective, see docs for reference
  4. Animation curve. e.g spring(300,20,0)

What it does

Example

Flip Card Example

Instructions

1.Include the module

flipCard = require "flipCard"

2.Add a front image layer + back image layer + the perspective + animation curve

flipCard.flipEffect(frontLayer, backLayer, 1600, "spring(300,20,0)")

note: 1600 is the perspective number used in the example above. The smaller the number the more perspective you get.

About

A framer module to quickly create a flip card effect with two image layers


Languages

Language:JavaScript 98.8%Language:CSS 0.6%Language:CoffeeScript 0.4%Language:HTML 0.2%