Google gravity y gravity script son dos buenas demostraciones. pero no hay código fuente ni tutoriales disponibles. y los archivos JS originales son muy grandes. ¿Cómo puedo crear un efecto Gravedad con Arrastrar & soltar (especialmente "Lanzar" y "rotativo" como Google Gravity) en un elemento determinado?¿Cómo crear un efecto de gravedad con Javascript?
Deseará comenzar con un motor de física, el que Google Gravity usa es Box2Djs que es un puerto de JavaScript de Box2D. Puede leer el manual de Box2D para aprender a usarlo, aunque el manual en sí dice que tendrá poca idea de lo que está haciendo sin algún conocimiento de la física rígida del cuerpo (fuerza, impulso, torque, etc.), aunque estos ejemplos pueden ayuda a comenzar
Si quiere escribir el motor de físicas usted mismo, tendrá que implementar al menos una dinámica de cuerpo rígido 2D y detección de colisión para que se vea como los ejemplos que dio. Un tutorial para hacer eso se llamaría una clase de simulación por computadora y tendría un álgebra lineal y un requisito previo de física I, no es una tarea trivial.
Después, tendrá que aprender acerca de las técnicas de animación de JavaScript. Recomiendo aprender sobre window.requestAnimationFrame. Usar setInterval(stepFunction, time) funcionará, pero no será tan eficiente como podría ser en los navegadores modernos.
gracias, la versión de JS está disponible en @ box2d-js.sourceforge.net/index2.html. pero quiero crear este efecto en elementos HTML reales. por ejemplo, tengo algunos botones sociales que se caen cuando la página se activa y los usuarios pueden lanzarlos y jugar con el tema :). Box2dJS es ideal para el desarrollo de juegos basados en web, pero creo que está basado en elementos "convas" y no en HTML. – Towhid
Mira un plugin jQuery esta en github JQuery.throwable Eso sí, $("Selector").throwable() y el objeto será por gravedad
En cuanto a su segundo enlace, el código es absolutamente disponible - es en http://gravityscript.googlecode.com /svn/trunk/gravityscript.js Es grande, pero eso se debe a que incluye varias bibliotecas, incluidas jQuery y Box2D. Más allá de eso, en realidad es bastante legible. Simplemente omita pasar los grandes bloques de JS minificados al código real formateado. –
En realidad, si nos fijamos en el código src de la secuencia de comandos de gravedad http://code.google.com/p/gravityscript/source/browse/trunk/gravityscript.js, solo el código de jQuery src está ofuscado, pero el código de la gravedad no es No debería ser difícil darse cuenta de eso. –
Similar a http://stackoverflow.com/questions/2185850/drag-elements-around-with-gravity-effect – j08691