flipclock开发手册_flipclock

A fully featured countdown clock.

FlipClock.js

Installation

FlipClock is designed to be used a UMD or ES6 module that can be required and

imported. NPM is the primary package manager. The CDN exposes FlipClock as a

global variable.

NPM

npm install flipclock --save

CDN

Specific version

https://cdn.jsdelivr.net/npm/flipclock@<?js = pkg.version ?>/dist/flipclock.min.js

Always use latest version

https://cdn.jsdelivr.net/npm/flipclock/dist/flipclock.min.js

Download .ZIP

New in v1.0

FlipClock originally was developed an example library for a computer science class that I taught. I never actually thought people would use it, let alone imagine how people would use it. It's been a long time coming, but FlipClock.js has been rewritten for a modern age with no dependencies.

Rewritten ES6 Syntax

No dependencies, pure vanilla JS

Import with Webpack, Rollup, Browserify with the UMD build

Mobile friendly with responsive CSS

Supports negative values

Supports alpha values

All new CSS themes for different flip effects

All new clock faces

Extensible and customizable

Unit testing with Jest

Basic Usage

import FlipClock from 'flipclock';

const el = document.querySelector('.clock');

const clock = new FlipClock(el, new Date, {

face: 'HourCounter'

});

Collaborators

Special Credit

Big thanks to all the examples on the Internet. But in particular, a huge thanks goes out to Adem Ilter who built this example, which provided the best animation and least amount of code to prove the concept.

License

HomePage

Repository