What is jquery.pep.js?

jquery.pep.js is a lightweight jQuery plugin which turns any DOM element into a draggable object. It works across mostly all browsers, from old to new, from touch to click. I built it to serve a need in which jQuery UI’s draggable was not fulfilling, since it didn’t work on touch devices (without some hackery).

All of Pep’s options are outlined on Github, so take a look. Feel free to email me with any questions you may have, or request a feature below.

Also, check out all of the demos below. Click on the icon to go straight to the demo on Codepen, where you can see exactly how each demo is made. You can also learn more about me. Enjoy!

Usage

Grab Pep via bower or grab from CDN: 

$ bower install jquery.pep

Then plug into page and initialize:

<script src="jquery.js"></script>
<script src="dist/jquery.pep.min.js"></script>
<script>
  jQuery(function($) {
    // pep is super simple...but there are wayyy
    // more options doc'd on github.
    $('#pep').pep(); 
  });
</script>
Demo #1: Basic
Demo #2: Constrain to Parent
Demo #3: Constrain to Window
Demo #4: Custom Easing Function
Demo #5: X/Y Axis
Demo #6: Droppable
Demo #7: Droppable - Custom Overlap Function
Demo #8: Droppable - Consuming Parent
Demo #9: Elastic Scroller
Demo #10: Image Inspector

See the Pen [Pep] Demo - Image Inspector by Brian Gonzalez (@briangonzalez) on CodePen

More Demos

Want your demo featured here with your name? Let me know.

Found a bug?

File an issue on Github, por̃ favor

About the Author

Yo, I'm Brian Gonzalez.

Hey guys! I built Pep in the deep, cold California Winter of ‘12. At the time, I was building out Geni’s version of their HTML5 Tree, which we wanted to work in all browsers from IE6 to mobile. And although Geni’s HTML5 Tree doesn’t work in all of those browsers, I’ve worked hard to make sure Pep supports browsers all the way back to IE6. Don’t believe me? Well then clone the repo.

Find me on the webs

Swing by my site, check out what I am hacking on, view some pixels, email me with any questions you may have, or shout at me on Twitter below.