如何用Javascript創建重力效果？

Google gravity和是兩個很好的示範。，但沒有可用的源代碼或教程。和原始的JS文件非常大。如何創建一個重力效果與拖動&下降（特別是「投擲」和「旋轉」像谷歌的重力）在某一元素？如何用Javascript創建重力效果？

2012-01-11 Towhid

看你的第二個鏈接，代碼絕對可用 - 它在http://gravityscript.googlecode.com /svn/trunk/gravityscript.js。它很大，但那是因爲它包含了幾個庫，包括jQuery和Box2D。除此之外，它實際上是相當可讀的。只需跳過跳過大塊縮小的JS到實際格式化的代碼。 – 2012-01-11 19:47:56

實際上，如果您查看引力腳本http://code.google.com/p/gravityscript/source/browse/trunk/gravityscript.js的src代碼，只會對jQuery src代碼進行模糊處理，但代碼重力不是。應該不難弄清楚。 – 2012-01-11 19:49:40

類似於http://stackoverflow.com/questions/2185850/drag-elements-around-with-gravity-effect – j08691 2012-01-11 20:33:46

你會希望從物理引擎開始，Google Gravity使用的是Box2Djs這是一個JavaScript端口Box2D。您可以閱讀Box2D手冊以瞭解如何使用它，雖然手冊本身聲明，如果您不瞭解剛體物理（力，衝量，扭矩等），您將不知道自己在做什麼，儘管這些示例可能幫助你開始。

如果你想自己編寫物理引擎，你必須至少實現二維剛體動力學和碰撞檢測才能看起來像你給的例子。這樣做的教程將被稱爲計算機模擬類，並且將具有線性代數和物理前提條件，這不是一項簡單的任務。

之後，您將不得不學習JavaScript動畫技巧。我建議學習window.requestAnimationFrame。使用setInterval(stepFunction, time)可以工作，但不會像現代瀏覽器中那樣高效。

來源

2012-01-12 20:32:20 nwellcome

謝謝，它的JS版本可用@ box2d-js.sourceforge.net/index2.html。但我想在實際的HTML元素上創建這種效果。例如我有幾個社交按鈕，當頁面被激活時，用戶可以拋出它們並玩主題:)。 Box2dJS非常適合基於Web的遊戲開發，但我認爲它基於「convas」而不是HTML元素。 – Towhid 2012-01-13 12:53:07

看在github上一本jQuery插件JQuery.throwable 只是做$("Selector").throwable()和對象會在重力作用下

來源

2013-03-20 22:25:07 benahm

如何用Javascript創建重力效果？

回答

相關問題