zflickjs

iOS, Android に特化した超軽量なflickjsを頑張ってつくるよ!CSS3 + JavaScript で。

This project is maintained by funnythingz

zflickjs v2.1

iOS, Androidなどのwebkitベースで提供するサービスではjQueryなどのライブラリを使わず、pureなJavaScriptで実装した方がパフォーマンス良いんじゃないかと思って作ってみた

Updated of Lists

lampクリックでカレント切り替えできるようにしたお

Demo

Demoをみる

prev next

Getting Started

タグ内にzflick.cssとzflick-2.1.min.jsを読み込む。

HTML

HTMLを組む。基本的にJSで動かす要素はID指定になっている。

JS

new zflickjs({})で初期化

Options

  • width: number
    • 280 ... width move
  • autoChange: boolean
    • true ... "true" auto move element, "false" don't move
  • autoTimer: number
    • 4000 ... millisecond
  • lamp: string ID
    • 'zflickLamp' ... lamp element ID
  • initCallback: function
    • function(){console.log('inited')} ... inited callback method
  • moveCallback: function
    • function(){console.log('moved')} ... moved callback method
  • btn: object
    • {prev: 'prevBtn', next: 'nextBtn'} ... click event element
  • loop: true
    • true ... "true" looping!, "false" don't loop

Credits

funnythingz