Nuanced Pumpkin Mavens

    circlr

    3.1.1 • Public • Published

    circlr

    Animation rotation via scroll, mouse and touch events

    • Horizontal or vertical orientation
    • Touch events support
    • Scroll support
    • Reverse and cyclic rotation

    Install

    npm install --save circlr

    Usage

    import circlr from 'circlr';
     
    const el = document.querySelector('.container');
     
    circlr(el)
      .scroll(true)
      .play()
      .on('show', n => {
     
      });

    API

    circlr(el)

    Create rotation instance.

    el

    Type: string, element

    Element.

    .scroll(n)

    n

    Type: boolean

    Rotation via scroll flag.

    .vertical(n)

    n

    Type: boolean

    Vertical orientation flag.

    .reverse(n)

    n

    Type: boolean

    Reverse rotation flag.

    .cycle(n)

    n

    Type: boolean

    Cyclic rotation flag, default true.

    .start(n)

    n

    Type: number

    Start frame, default 0.

    .interval(ms)

    n

    Type: number

    Playback interval, default 75 ms.

    .play([n])

    Start sequence playback.

    n

    Type: number

    Frame number for playback to him or infinity playback if number in not specified.

    .stop()

    Stop playback.

    .show(n)

    Show specified frame.

    n

    Type: number

    Frame number.

    .prev()

    Show previous frame.

    .next()

    Show next frame.

    .unbind()

    Unbind rotation events.

    Events

    • show, when frame is showed

    Support

    • Internet Explorer 9+
    • Chrome
    • Safari
    • Firefox
    • Opera

    Related

    License

    MIT

    Install

    npm i circlr

    DownloadsWeekly Downloads

    464

    Version

    3.1.1

    License

    MIT

    Last publish

    Collaborators

    • andrepolischuk