
こんにちは。クレイの浅海です。 いま話題のLeapMotionとJavascriptを使って、空中でピアノを演奏できるアプリを作りました。 まだLeapMotionを初めて数日なので勘違いしている部分もあるかもしれませんが、JavaScriptでLeapMotion対応アプリをどのように作るのかについて、気づいたことを紹介します。 目次 デモ leap.jsの用意 イベントループ Frameオブジェクト frame.fingers frame.hands frame.gestures circle swipe keyTap screenTap 感想 デモのコード デモ まずは実際に動かしている動画を御覧ください。 空中に手をかざすだけで、ピアノを演奏することができます。 音の再生にはMIDI.jsを使用しています。 ※ 手を3Dで表示している部分は、LeapMotion標準のビジュアライザ
使いどころは難しいですが、面白いユーザインターフェイスを備えた画像をスライド表示するカルーセルのスクリプトを紹介します。 デモ3:画像をクリックすると拡大します。 Tiny Circlesliderの特徴 わずか4KBの軽量スクリプト。 カスタマイズは簡単。 スライド操作は手動と自動に対応。 スライドの半径は自由に設定可能。 すべての動作にcallbackを設定可能。 オプションも豊富に用意。 [ad#ad-2] Tiny Circlesliderの実装 HTML カルーセルで表示する各画像はリスト要素で実装します。 HTMLの基本は下記のようになります。 <div id="rotatescroll"> <div class="viewport"> <ul class="overview"> <li><a rel="group" href="images/hdr1.jpg"><img sr
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く