Create Gravity and Drag Effects With jQuery - jGravity

jGravity is a blazing fast JavaScript motion library written in jQuery that allows the user to drag any elements around with a gravity effect on the webpage.

How to use it:

1. Download and load the jGravity.js script after loading JavaScript library.

<!-- jQuery *Required -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 
        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
        crossorigin="anonymous"></script>
<!-- jGravity file -->
<script src="jGravity.js"></script>

2. Call the function jGravity on the body element and specify the target critera e.g. 'div, p, span', 'h2' or 'div#specificDiv', or even 'everything' to target everything in the body.

// jGravity works best when targeting the body
$('body').jGravity({ 
  target: 'everything'
});

3. Specify if you would like to use an ignore class, and then specify the class.

$('body').jGravity({ 
  target: 'everything',
  ignoreClass: 'ignoreMe'
});

4. Specify the depth value which will be used to prevent targeting structural divs or other items which may break layout in jGravity.

$('body').jGravity({ 
  target: 'everything',
  ignoreClass: 'ignoreMe',
  depth: 5 // 1-10
});

5. Decide if users can drag elements which have been effected by jGravity.

$('body').jGravity({ 
  target: 'everything',
  drag: true
});

6. Specify the 'weight' value. You can also use 'heavy' or 'light'

$('body').jGravity({ 
  target: 'everything',
  weight: 25 // 1-100
});

---

This awesome jQuery plugin is developed by tinybigideas. For more Advanced Usages, please check the demo page or visit the official website.