jQuery Plugin For Draggable 360s Image Sequences - threesixtyjs

File Size: 2.99 MB
Views Total: 32376
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
jQuery Plugin For Draggable 360s Image Sequences - threesixtyjs

threesixtyjs is a jQuery plugin for creating Draggable 360s Image Sequences. It is good for rotating images on drag and/or click to show your products from every angle.

How to use it:

1. Include jQuery library and threesixty.js in your page

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="assets/js/jquery.threesixty.js"></script> 

2. Markup. Using data-count attribute to set the number of images.

<div class="threesixty" data-path="assets/img/src/gem{index}.jpg" data-count="61"> 

3. Call the plugin with options


  var $threeSixty = $('.threesixty');


    // horizontal OR vertical
    dragDirection: 'horizontal', 

    // use arrow keys
    useKeys: true,

    // is draggable?
    draggable: true


4. API methods.

// goto next frame

// back to previous frame

5. Available events.

$threeSixty.on('down', function(){
  // when user starts to drag 

$threeSixty.on('move', function(){
  // when user is dragging

$threeSixty.on('up', function(){
  // when user finishes dragging



  • v0.1.2

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