jQuery Reel Example

360° Stitched Panorama Example

Pre-made stitched panorama can be spinned 360° using mouse drag or mouse wheel.

jQuery Reel plugin using latest jQuery aided by additional jQuery plugins:

Brandon Aaron's jQuery Mousewheel [local mirror]
James Dempster's jQuery DisableTextSelect [local mirror]


      
  <!DOCTYPE html>
  <html>
      <head>
          <script src='http://code.jquery.com/jquery-latest.min.js'></script>
          <script src='jquery.reel-min.js'></script>
          <script src='inc/jquery.disabletextselect-min.js'></script>
          <script src='inc/jquery.mousewheel-min.js'></script>
      </head>
      <body>
          <img id='image' src='stitched-panorama.jpg' width='590' height='150' />
          <script>
              $(document).ready(function(){
                  $('#image').reel({
                      stitched: 1652, 
                      saves: true 
                  });
              });
          </script>
      </body>
  </html>

Plugin uses src and width & height dimensions of #image. It then looks into stitched-panorama.jpg's folder and automatically chooses another image named stitched-panorama-reel.jpg for Reel interactions.

More about Reel plugin The world's first JavaScript projector of 360° panoramic images