Skip to content

isoden/skewslider

Folders and files

NameName
Last commit message
Last commit date

Latest commit

8a38047 · Oct 11, 2016

History

23 Commits
Oct 11, 2016
Oct 11, 2016
Sep 2, 2015
Oct 10, 2016
Oct 11, 2016
Oct 11, 2016
Oct 11, 2016
Oct 11, 2016
Oct 11, 2016
Oct 10, 2016
Oct 11, 2016

Repository files navigation

skewSlider

npm

Demo

Installation

 $ npm install --save skewslider

Usage

<canvas id="canvas" width="640" height="640"></canvas>
<script src="path/to/skewslider.js"></script>
var skewSlider = new SkewSlider({
  el       : document.getElementById('canvas'),
  angle    : 15,
  interval : 5000,
  duration : 1000,
  sources  : [
    'http://placeimg.com/640/640/people?p=1',
    'http://placeimg.com/640/640/people?p=2',
    'http://placeimg.com/640/640/people?p=3',
    'http://placeimg.com/640/640/people?p=4'
  ]
});

Options

name description default
el: HTMLCanvasElement 描画対象のCanvas要素 -
angle: number 斜めの角度 0
interval: number 次のアニメーションまでの時間(ms) 2000
duration: number アニメーションの時間(ms) 1000
sources: string[] 画像URLの配列 -

Support

IE >= 9 and modern browsers.

License

MIT License.

About

Using the canvas, it's a slideshow of the skew effect

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published