1.0.1 • Published 7 years ago
kinkajs v1.0.1
kinka.js とは
ウェブページ内を自由に飛びまわる8bit風の かわいいキンカチョウ (英:Zebra finch) が表示できます
デモはこちら
あなたのウェブページでキンカチョウを飼ってみませんか?
Install
bower
bower install kinkajsnpm
npm install kinkajs使い方
<head>
<script src="./bower_components/kinkajs/kinka.js"></script>
</head>
<body>
<div class="kinka"></div>
<div class="yourtag perch"></div>
</body>- kinka.jsを読み込みます
- class名に
kinkaと付けたDIVタグを書きます。このタグの数だけキンカチョウが表示されます - 任意のタグのclass名に
perch (止まり木)を追加すると、そのタグの上部にキンカチョウが止まってくれます - 画面上をロングタップするとキンカチョウが止まりに来ます
その他の設定パラメータ
キンカチョウの画像 と 一番最初に止まるタグ を設定することが可能です
<div class="kinka kinkasp2 perch3"></div>kinkasp2でキンカチョウの画像を変更します (kinkasp1kinkasp2kinkasp3が利用できます)perch3で一番最初に止まるタグを変更します (perch (止まり木)を指定したタグの数で変わります)
スプライト画像のカスタマイズ方法
const ASSET_FILES = ["sprite.png", "sprite2.png", "sprite3.png"]
const KINKA_SIZE = 50
const KINKA_BOTTOM_OFFSET = 10- 上記コードを自由に変更してください
- キンカチョウのスプライト画像は
停止状態停止状態停止状態歩き状態歩き状態飛行状態飛行状態飛行状態の8コマです- 各コマは正方形にしてください
- 大きさは自由です
KINKA_SIZEはキンカチョウの表示サイズ、KINKA_BOTTOM_OFFSETはスプライト画像の下部の余白に対する調整値です
Team kinka.js
- まつ : 企画、開発
- Market U : キンカチョウ監修、ドット絵
- ハッちゃん : キンカチョウ (ドット絵モデル)
ライセンス
The MIT License (MIT)
Copyright 2018 Team kinka.js