2012-10-15 2 views
10

player stackキャンバスではなくdivなどのHTML要素で動作するJavaScript物理ライブラリがありますか?

私は、選手たちは、彼らが作品の受賞手を収集し、仕上げにどれだけ近いかを追跡するために周りの番号駒を動かすゲームのための単純なスタックに取り組んでいます。

現在、私はjQuery UIのドラッグアンドドロップ可能で行った。簡単に始めるのにはいいですが、一度に1つのパーツしか移動できません:http://cssdeck.com/labs/cowmmudd/4

  • 私は、jQuery UIを使用するのではなく、実際のJavaScript物理ライブラリに移動することをアウトソースしたいと思います。 (上の行の青4を左に動かすと、その行のすべての部分が一緒に強制的に移動されます)
  • 通常のHTML要素を使用して、約理由。 (私が使用canvasを見てとっているが、私はGoogleがかつて行ったように、TE同じことを達成したいすべてのJavascriptの物理ライブラリ:http://mrdoob.com/projects/chromeexperiments/google-gravity/

は、誰かがnot-、通常の配置と衝突を制御する最小限の例を提供することができます彼らが知っている最高のJavaScript物理ライブラリを使用してキャンバス内のHTML要素を作成しますか?

+0

あなたは必ず行く方法はある追加の外部のライブラリを使用していますか?落としたときに同じ高さのタイルをチェックするだけで、移動できればそこにアニメーションを残すことができますか? –

+1

@BenjaminGruenbaum私は物理学と数学と幾何学の完全な騒ぎであるので、維持できないコードをたくさん書いて欲しいとは思わない。私はゲームオブジェクトのプロパティを宣言し、適切な図書館に私のための衝突と配置を世話したいと思っています。 –

+1

JSバージョンのbox2dには、キャンバスを使ったデバッグレンダラーがありますが、それは単にデフォルトです。オブジェクトを任意の方法でレンダリングできます。シミュレーションと描画は独立しています。 –

答えて

4

私がこれまでに発見した最も単純な例: http://bl.ocks.org/3411189

アップデート:私の作品に簡単に適合:http://cssdeck.com/labs/fe3z2cfx/6

+1

これらのリンクのいずれかが警告なく削除されるか、永続的なフィクスチャですか?ほとんどの場合、答えの中の実際のコードを貼り付け、リンクを参照する方がよいでしょう。それ以外の場合は、リソースが突然消えたら、あなたの答えは役に立たなくなります。 http://meta.stackexchange.com/questions/8231/are-answers-that-just-contain-links-elsewhere-really-good-answers –

+0

@RobertHarvey:そうです、私はcssdeckを編集しますあなたの提案! –

+0

@RobertHarvey:2つの短いJSスニペットを埋め込み、元のソースへの参照を追加する回答を更新しました。 –

関連する問題