All Projects → benahm → jquery.throwable

benahm / jquery.throwable

Licence: other
JQuery plugin to make HTML elements throwable

Programming Languages

HTML
75241 projects

Projects that are alternatives of or similar to jquery.throwable

guillotine
jQuery plugin to crop images within an area (fully responsive), allowing to drag (touch support), zoom and rotate.
Stars: ✭ 321 (+365.22%)
Mutual labels:  jquery-plugin
jQuery-Awesome-Sosmed-Share-Button
Awesome Social Media Share Button With Share Count
Stars: ✭ 58 (-15.94%)
Mutual labels:  jquery-plugin
blog
仿照nswbmw的N-blog项目写的多人博客系统,引入了bootstrap和jquery validation plugin。详见wiki部分。
Stars: ✭ 10 (-85.51%)
Mutual labels:  jquery-plugin
paginathing
a jQuery plugin to paginate your DOM easily.
Stars: ✭ 23 (-66.67%)
Mutual labels:  jquery-plugin
desoslide
Take control of your slideshow with this powerful jQuery plugin
Stars: ✭ 68 (-1.45%)
Mutual labels:  jquery-plugin
valida
jQuery Plugin for client side easy form validations.
Stars: ✭ 17 (-75.36%)
Mutual labels:  jquery-plugin
jquery-svg-convert
Convert .svg images to code on the fly with jQuery
Stars: ✭ 30 (-56.52%)
Mutual labels:  jquery-plugin
floating-scroll
Lightweight jQuery plugin providing floating scrollbar functionality
Stars: ✭ 72 (+4.35%)
Mutual labels:  jquery-plugin
jquery-scrollToTop
A jQuery plugin that display a button for scrolling the page to the top.
Stars: ✭ 14 (-79.71%)
Mutual labels:  jquery-plugin
drawer
A touch-enabled drawer component for the modern web.
Stars: ✭ 26 (-62.32%)
Mutual labels:  jquery-plugin
Parallaxie
Easiest, Responsive and Customizable Parallax jQuery Plugin
Stars: ✭ 65 (-5.8%)
Mutual labels:  jquery-plugin
jquery.pwstrength
A jQuery plugin to indicate the strength of passwords
Stars: ✭ 22 (-68.12%)
Mutual labels:  jquery-plugin
jQuery-Sakura
Make it rain - sakura petals or anything else for that matter.
Stars: ✭ 76 (+10.14%)
Mutual labels:  jquery-plugin
conditionize.js
Small jQuery plugins for handling conditional form fields via data attributes. Unmaintained.
Stars: ✭ 56 (-18.84%)
Mutual labels:  jquery-plugin
Persian-DatePicker
jQuery UI Datepicker with bootstrap theme (Persian Shamsi, Arabic, Gregorian Calendar Support)
Stars: ✭ 36 (-47.83%)
Mutual labels:  jquery-plugin
jquery.geocomplete
A simple plugin for Google Maps Autocomplete.
Stars: ✭ 15 (-78.26%)
Mutual labels:  jquery-plugin
Ace-Responsive-Menu
Ace responsive menu is a lightweight jQuery plugin to create responsive multi-level navigation menus with multi device support. Ace responsive menu comes with 3 variants like horizontal, vertical and accordion menu. It gives complete responsive menu solution for any kind of websites or admin templates. The plugin has clean and well commented val…
Stars: ✭ 46 (-33.33%)
Mutual labels:  jquery-plugin
xGallerify
A lightweight, responsive, smart gallery based on jQuery
Stars: ✭ 52 (-24.64%)
Mutual labels:  jquery-plugin
Accordion.JS
Accordion.JS: Free jQuery Accordion plugin
Stars: ✭ 34 (-50.72%)
Mutual labels:  jquery-plugin
Zebra Tooltips
A lightweight, accessible, and highly configurable jQuery plugin for creating beautiful tooltips
Stars: ✭ 52 (-24.64%)
Mutual labels:  jquery-plugin

JQuery.throwable

JQuery plugin to make HTML elements throwable

Create physical-like HTML objects in your browser

Code example

$(".box2d").throwable({
                        containment:[0,0,500,500],
                        drag:true,
                        gravity:{x:0,y:0},
                        impulse:{
                            f:52,
                            p:{x:1,y:1}
                        },
                        shape:"circle",
                        autostart:false,
                        bounce:0.5,
                        damping:100,
                        areaDetection:[[0,0,300,300]],
                        collisionDetection: true
                    });

Options

* gravity: object {x:valueX,y:valueY} 
* container: define the limits where the object can be thrown 
                   "window" is the default
                   "parent" the object will be contained inside the parent
                   you can specify custom a container by giving array [x1,y1,x2,y2]
* shape: defines the shape of the object, by default is "box" and you can specify "circle"
* autostart: by default the effects start at mouse move 
* drag: boolean to specify if the object will be draggable or not, by default it is set to true
* impulse: you can specify an impluse to apply on the object by giving an object 
                   {
                        f: forceValue, // define the energy of the impluse (number)
                        p: pointDirection //define the direction on the impluse object like the gravity option
                   }
* bounce: defines the bounce effect of the body (value between 0 and 1) default 0, no bounce
* damping: defines the damping(*) effect value from 0 to infini, default 0 
* areaDetection: specify an array of areas, that when an objet enter those areas the event inarea is fired 
                 and outarea event fired when exiting
* collisionDectection : bool to activate or desactivate the collision detection 

(*) : damping

Events & Callbacks

* inarea : fired when an object enter and area specified in the option areaDetection
* outarea : fired when an object exit and area specified in the option areaDetection
* collision : fired when a collision happened between two objects 
* nocollision : fired when there is no collision 

Requirements

* JQuery (of course it's a jquery plugin)

Demos

Credits

How to use it!

You can test it by including this js link to your page

<script src="http://benahm.github.io/jquery.throwable/javascripts/jquery.throwable.js" type="text/javascript"></script> 

Or download the js file

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].