reel

verb
  1. ...
  2. the room reeled GO ROUND, go round and round, whirl, spin, revolve, swirl, twirl, turn, swim.
Fork me on GitHub

Try dragging this area or roll your mouse wheel over it Now even on Android

Reel 1.3 is an established and the most versatile three-sixty player for jQuery. Teaches your ordinary image tag some new tricks turning it into a gorgeous interactive 360° object movie, panorama or stop-motion animation. Reel is the premier alternative to Flash, Java or Quicktime and is trusted by government agencies and big brands like BMW, Nikon, O2, Blackberry or The New York Times.

back up
Follow jQuery Reel on G+ and Github
back up

Download jquery.reel.js

version 1.3.0, minified, gziped, CDN, ~ 10.0 kB
More download options...
back up

Demonstration

An image is worth a thousand words. And how about an interactive one!

Try reel for yourself. Place your mouse pointer over images below. And roll your mouse wheel up/down or drag the mouse left/right (or even up/down).

Stitched panoramas are supported too:

Moro Rock Lookout 1 Way Rd, Giant Sequoia National Park, CA Panther Peak Mount Silliman Castle Rocks Moro Rock Ash Peaks Ridge Milk Ranch Peak

You can also embed annotations (e.g. text or images) of individual features on the scene. Annotations are available for all operational modes and are synchronized with Reel's motion.

See all 19 examples incl. code samples

Photos credits: RC formula by Erik Kluka | Mini Cooper S by PhotoSpherix | Moro Rock, Giant Sequoia National Park, California USA by Henning Leweke (cc)

back up

How to?

  1. Link jquery.reel.js in your document.
  2. NEW And to create greenful panorama like the one above right, just add class reel to your HTML <img> and configure with options as data attributes:
      <img src="/demo/green.jpg" width="168" height="126"
        class="reel"
        data-image="/demo/green-reel.jpg"
        data-frames="32"
        data-footage="4"
        data-revolution="800">

Check out other options you can use and combine

back up

Is it compatible?

* Under the hood Reel uses nothing else than CSS background image positioning which is pretty common in all today's browsers. No magic. Even ancient Internet Explorer versions are capable of it. Hence the extra wide compatibility. See detailed report.

back up

Who uses it?

back up

Is it free?

Please donate a little via Pledgie or PayPal to show your love and care :)

back up

RSS Latest news

2013-12-31
To date, Reel is used on 2014+ domains world-wide. Very happy 2014 to you!
2013-11-05
NEW Reel 1.3 has been released and as usual brings many fixes and enahncements. Improvements in annotations, new license (still free, still MIT, but no GPL), AMD and CommonJS compatibility, responsive mode, animation duration, "shy" on-demand mode, gyroscope support, performance enhancements and few more sweets. Also a brand new Javascript-less method of intializing Reel with the help of HTML data attributes only.
2013-02-23
Reel 1.2.1 fixes compatibility issues with latest version of jQuery (up to 2.0 beta actually) and besides some sweet refactoring achievements (new tricks with virtually no file size growth) brings new exciting multi-row panoramas option, extended throw control and some more.
2012-09-10
The CDN has run dry today and was rejecting requests. The full service was resumed to normal at 17:30 GMT (btw. that's where your generous donation money go). Deep apologies for any inconvenience. If you'd like to help prevent such outages in future, please donate.
2012-07-16
Brand new Reel 1.2 is OUT with so many closed tickets landed in this release. It brings Android compatibility (yay!), in-picture annotations, simplified image sequences, much improved preloading, stepping by clicking, dry examples, lots of embedded code documentation, few other new options and many big or small fixes. Enjoy! :) You can download it directly, the CDN will serve the new version as of Wednesday 18th.
2012-02-27
In the meantime Reel 1.1.4 rushes in to resolve IE issues related to jQuery 1.7.
2012-02-17
Development of the new version of Reel has reached the public beta testing phase. If you'd like to preview and test, please grab the beta code at Github and feel free to report back.
2012-01-25
Reel usage has truly flourished since the last news and now well over 100 websites around the globe have put their trust into Reel. Be it Blackberry, Honda, BMW, Adidas, Diesel or BASF, you name it. To showcase these, Reel got its own Google+ page and each week one site is picked and featured there. Do not miss! Also, even better version 1.2 is just around the corner :)
2011-05-08
Reel 1.1.3 doesn't add any new functionality or options. Instead it promptly fixes the jQuery 1.6 incompatibility and is now fully compatible with all versions of jQuery from 1.4.2 up. And it also fixes some minor stuff along the way.
2011-05-07
An incompatibility with the latest jQuery 1.6 released few days ago has been discovered. 1.5.x works just fine. Working hard to fix it soon. Sorry for the trouble, folks.
2011-04-30
Even before the Reel 1.1.2 release, Rowlands Group announced the release of their Formatter beta 3 for Drupal and short after Josh Gourneau announced his Python script for producing the sprites . Lovely tools emerging from the community :)
2011-04-25
Recently I took time to nail some issues reported directly by e-mail or on Github and the latest patch release 1.1.2 which came out this Easter Monday fixes many of them improving the overall experience especially in IE, Firefox and Safari (iPad).
2011-03-21
Patch release 1.1.1 out! Amongst few performance improvements it fixes first-sequence-frame-vanishing and ios-vertical-scrolling bugs, which were troubling many of you. Performance on iPad has also been enhanced. Thank you all for your kind support and contributions!
2011-01-06
Reel got a very nice Christmas gift in Olivier de Broqueville 's announcement of Adobe's approval of his free 360° Rotation Viewer widget, a Dreamweaver extension having Reel under the bonnet! Tidbit for all you Dreamweavers. Happy new year!
2010-11-27
Brand new jQuery Reel 1.1 is OUT! It took long, but so many feature requests by users had been satisfied: vertical setups (multi-row and orbital modes), animation!, sequence of individual images, better iPad compatibility and many more - see changelog. Despite tons of changes 1.1 is fully backwards compatible with 1.0, so effective from today the CDN now by default serves version 1.1. You have helped me great deal. Thank you all a enjoy this release :)
2010-04-26
Last week Reel got its first ever tutorial - Full 360-Degree Product Image Rotation in JavaScript
2010-04-24
Some of you may have noticed weird skipping motion of stitched panoramas. Sadly, I didn't. Luckily, Elissaios Koumridis did and reported it. Thanks! It's now all fixed and covered with tests :-)
2010-04-19
Reel 1.0.4 "Touchy" is out. And it is a rather significant release. Long awaited by the community, one known issue has been resolved and Reel now works on iPhone in Safari! Thanks to the help of Michael Crane and other kind iPhone testers. It should also work on other Apple touch devices as iPad and iPod Touch. Opera Mini is still not supported though, but just hold on... See all changes
2010-03-29
iPhone/iPad Tester wanted. If you own an iPhone (or iPad) and are willing to help the Reel community, please contact me right away.
We got the testers, thanks!
2010-03-23
As the word is spreading (thanks to mentions in posts like Best jQuery Plugins - August 2009 or more recent How jQuery is Killing Flash and blog posts in AjaxLine jQuery Wisdom Design Beep aext.net w3avenue and AjaxMint ), a positive response can be observed among users and audience. Thank you! Many of you already use Reel plugin for your own wonderful stuff. There are many new features on the list for upcoming 1.1.x version. Stay tuned, folks! Meantime, three easy examples of Reel plugin usage were added to the How to section.
2009-08-31
The Reel plugin version 1.0 is out. On top of the RC it now also supports classic-style stitched panoramas and many more. Inspect version change log for details.
2009-08-25
First release candidate is out!
Expand older news »
back up

Download

Current version is (from 2013-11-04) 1.3.0

You can shave off more then half of the size by having the files served from CDN locations instead of downloading.

See change log for changes

back up

Syntax

NEW Forget syntax! Add class reel to your <img> tag and Reel will pick it up automatically without need for writing any Javascript.

      <img src... class="reel" id="my_picture">

Customize with options.

Annotations Syntax

NEW Optionally add class reel-annotation to any element in your HTML to place it "inside" the interactive image, synchronized with its motion.

      <a href... class="reel-annotation"
        data-for="my_picture"> My link </a>

Customize with annotations options.

back up

Options

NEW Use data attributes to customize options and shape up your Reel.

      <img...
        data-speed="0.5"
        data-clickfree="true"
        data-images="/photos/DSCN####.JPG|20..42">

A handful of options is available to be used to override the default values.

type option default
jQuery area undefined Use jQuery to extend the area sensitive to mouse or touch interaction. Will use the area of the image if left undefined .
Object attr {} Initial attribute-value pairs map for the IMG tag. Useful for dynamically setting up image dimensions.
Number brake 0.23 Braking force applied when slowing down the free spinning when dragged or thrown.
Boolean clickfree false Binds to mouse leave/enter events instead of down/up mouse events.
String cursor undefined Mouse cursor overriding the default one. You can use either hand for a grabbing palm of hand or any valid CSS `cursor` value. Reel's cursors are by default served by Reel's CDN .
Boolean cw false If your Reel image motion doesn't follow the mouse when dragged (moves in opposite direction), set this to true to indicate clockwise organization of frames.
Number delay 0 Delay before Reel starts playing by itself (in seconds).
Boolean directional false Two sets of frames are used when true - one set for forward followed by one for backward motion.
Boolean draggable true Allows mouse or finger drag interaction when true (allowed by default).
Number duration undefined NEW Animation playback duration (in seconds).
Number entry undefined Speed of the opening animation in Hz. Defaults to value of speed option.
Number footage 6 Number of frames per line (when horizontal) or per column (when vertical).
Number frame 1 Initial frame. Plugin instance starts with this frame. Frame 1 is the top left corner of the image. Thus loaded with the highest priority (as all frames in the top row not matter if horizontal or vertical).
Number frames 36 Total number of frames.
Boolean framelock false NEW In multi-row setup, this allows the frame to be locked in place leaving just the vertical interaction possible.
Function graph undefined Custom graph function.
String hint "" Text hint for hotspot tooltip.
Boolean horizontal true Flow of frames on the sheet. Default is line-by-line rather than column-by-column.
String image undefined Allows to override default sprite resolution based on IMG src filename by passing the path to the image sprite directly.
String images "" Filename string for series of images like `"image_###.jpg"`, where the `#` counter placeholder is replaced with an actual counter numbers. This is much faster than the alternative Array notation.
Array images [] You can also define images as a raw Array to gain complete control.
Number indicator 0 Can display a range progress indicator inside the image. By passing a positive value in pixels a black rectangle marker will stick to the bottom edge of your image. Customize the color by CSS. Its class name is reel-indicator
Boolean inversed false Flags inversed organization of frames in orbital object movie.
String klass "" You can pass your custom CSS class name for the plugin DOM node. It will accompany the fixed reel base class.
Number laziness 6 On "lazy" devices tempo is divided by this divisor for better performance.
Boolean loops true Can be used to suppress default wrap around behavior of the sequence. Use this option when your captured sequence is a incomplete revolution.
String monitor undefined For development you can monitor any stored value in the upper left corner of the viewport by passing its name. Customize it using CSS. Its class name is reel-monitor
Number opening 0 Duration of opening animation (in seconds).
Number orbital 0 View centering tolerance (in frames) for dual-orbit object movies.
Boolean orientable false NEW Enables interaction via device's built-in gyroscope (if available).
String path undefined URL path to be prepended to either image or images filenames.
String preload "fidelity" Preloading mode affecting the order of images loaded. linear gives you loading from number 1 to the last frame, whilst fidelity produces more evenly spread-out order.
Number preloader 4 Size (height) of a image loading indicator (in pixels). Indicator appears along the bottom edge of Reel image when using images sequence. Customize it using CSS. Its class name is reel-preloader
Number rebound 0.5 Time spent on the edge (in seconds) of a non-looping panorama before it bounces back.
Boolean responsive false NEW If switched to responsive mode, Reel will obey dimensions of its parent container, will grow to fit and will adjust the interaction and UI accordingly (and also on resize).
Number revolution undefined Distance in pixels the mouse must be dragged to cause one full revolution (when undefined it defaults to double the viewport width or half the stitched option).
Object revolution undefined For multi-row movies you can optionally define individual revolutions for both x and y axis.
Number row 1 Initial row for multi-row setups (see rows for more).
Number rows 0 Number of rows for a multi-row setup (default 0 means single-row setup).
Boolean rowlock false NEW In multi-row setup, this allows the row to be locked in place leaving just the horizontal interaction possible.
Boolean scrollable true Allows page scroll (allowed by default; applies only to touch devices).
Boolean shy false NEW In shy mode, Reel will preinitialize, but won't load until actually clicked.
Number spacing 0 Spacing between frames on the sheet (in pixels).
Number speed 0 Animated rotation speed in revolutions per second (Hz). Animation is disabled by default (0).
Boolean steppable true Allows to step the view (horizontally) by clicking on image.
Number stitched 0 Pixel width of stitched panorama image. If supplied the default frame-by-frame behavior changes to panoramic behavior which works with the classic style panorama.
String suffix "-reel" A portion of the sheet filename inserted right before image type extension. For example, for an image /path/to/image.jpg the sheet will be /path/to/image-reel.jpg by default.
Number tempo 25 Shared animation ticker tempo in ticks per second. Doesn't affect the speed.
Number timeout 2 Idle timeout after which animation is resumed (in seconds).
Boolean throwable true Allows drag & throw interaction (allowed by default).
Number throwable Maximal velocity when thrown.
Number velocity 0 Initial velocity of user interaction; washes off quickly with brake .
Boolean vertical false Switches orbital object movie to vertical mode.
Boolean wheelable true Allows mouse wheel interaction (allowed by default; requires external mouse wheel plugin ).

Learn more from the extensively annotated source code.

Annotations Options

NEW Similarily, use data attributes to customize your annotations.

      <a...
        data-for="my_picture"
        data-x="30,20,,,10"
        data-y="70"></a>
type option required
String at Visibility control string like "+--++++-" where each character maps to a frame, while plus rendering it visible. and minus otherwise.
String end Frame number from where the annotation ends being visible.
String for DOM ID of Reel instance the annotation will be attached to.
String start Frame number from which the annotation starts to be visible.
Number x Horizontal position relative to the Reel image.
Array x Optionally, list horizontal position coordinates for each frame.
Number y Vertical position relative to the Reel image.
Array y Optionally, list vertical position coordinates for each frame.

Learn more about annotations in the wiki.

back up

Requirements

back up

Known issues

Report an issue!

back up

Author

back up

Changelog

Version 1.3.0
  • Infrastructure
    • New alternative Javascript-less initialization with HTML data attributes » Github issue GH-193
    • Revised examples with syntax-highlighted code and improved index.
    • New AMD & CommonJS compatibility.
    • Annotations now compatible with many lightbox plugins » Github issue GH-219
    • Preloading cache moved from DOM to memory for better performance.
    • Hardware acceleration enabled in Firefox to help remedy occasional flickering therein » Github issue GH-196
    • Error message into the console in case target image properties were deemed insufficient.
    • Convenient event interface shortcut .reel(:event)
    • URLs containing special markup ( @W , @H or @T ) will get it substituted with actual values ( width and height data values or timestamp).
    • New $.reel.substitutes object for custom substitution methods.
    • The minimal required version of jQuery has been increased to 1.6.2.
    • New sequential less cloging method of preloading with configurable number of $.reel.concurrent_requests » Github issue GH-237
  • Data
    • Values of image and images data can now be changed on the fly » Github issue GH-190
    • Data key dimensions replaced with width and height keys.
  • Animation
    • New duration option for the animation » Github issue GH-90
    • New CPU power conservation feature disables the instance when off screen.
  • Events
    • New "reach" event for playing to certain frame.
    • New "stepUp" and "stepDown" events to complement "stepLeft" and "stepRight" » Github issue GH-202
    • Image loading "error" and "abort" events now propagated up the DOM » Github issue GH-179
  • Interaction
    • Annotation links click threshold increased to improve clickability » Github issue GH-186
    • New rowlock and framelock options allow mouse interaction lock of axis in multirow setups » Github issue GH-191
    • New option orientable enables gyroscope support on compatible devices » Github issue GH-92
    • New shy option initializes the instance only after a click » Github issue GH-224
  • UI
    • New responsive option adds capability to scale in responsive page layouts » Github issue GH-222
    • Fixed bug in vertical spacing calculation on iOS » Github issues GH-188 and 189.
  • Otherwise
    • Deprecated options step and steps , store and recall events and old usage of change reaction events to perform data change were all removed.
    • $.reel.touchy distinction became obsolete and was removed » Github issue GH-233
  • As of this release opted out of the dual license scheme and in for the MIT License only to carry on sharing of licensing policies with the jQuery framework itself.
Version 1.2.1
  • Resolved compatibility issues with jQuery 1.8 and 1.9 » Github issues GH-140 174 and 175
  • For smooth velocity kick it now follows "loaded" event (instead of "setup" ) » Github issue GH-142
  • Goodbye disableTextSelect dependency. You served well, but one less to worry about without you!
  • Vertical page scrolling on touch devices fixed » Github issue GH-146
  • Release package now contains image assets otherwise served by CND » Github issue GH-144
  • Case in-sensitivity for image extension in src attribute of the <img>
  • Exciting new multi-row panoramas via combination of multirow and stitched options » Github issue GH-129
  • The throwable option can now accept maximum velocity instead of simple boolean » Github issue GH-172
  • Fixed images sequence starting point now allows direct use of file names from camera.
Version 1.2
  • Infrastructure
    • The long-missing comprehensive documentation added to the `docs/` directory.
    • Improved order of preloaded images gradually increasing fidelity of the image, thus the name "fidelity" and this mode is now default. The former order is designated "linear". Preloading mode is chosen by new preload option accepting a mode name » Github issue GH-10
    • Completely reworked, centralized and enhanced naked examples with descriptions.
    • The minimal required version of jQuery has been increased to 1.5.
    • A brand new data interface with automatic change events is in place for easy external control of the instance. See Data wiki for more.
    • $.reel.cdn setting customization now working correctly » Github issue GH-124
  • Interaction
    • Non- wheelable Reels now allow scrolling of the page when wheeling above the Reel instance.
    • New option scrollable can disable page scrolling (if needed) on touch devices.
    • Bare click on left/right half of the image steps the Reel one frame forward/back. Set steppable to false to disable » Github issue GH-20
  • DOM
    • Custom text/graphics can augment the frames using the brand new annotations feature. See Annotations wiki for more. » Github issue GH-36
    • New option attr allows to set custom attributes of the IMG tag (useful for re-using DOM nodes).
    • Instances being re-instantiated now perform automatic teardown » Github issue GH-62
    • Proper image preload events unbinding on teardown » Github issue GH-64
    • Actual frame number is manifested with a wrapper class name, e.g. frame-8 » Github issue GH-69
  • Looks
    • Mouse cursor is now customizable with the new cursor option. New failsafe cursor is now move .
    • Default height of the preloader progress bar reduced to 2 pixels.
  • Other API Changes
    • Deprecated options hotspot , tooltip and reversed have been removed.
    • New complementary .unreel() function to revert effects of .reel() on the DOM.
    • The step and steps options deprecated in favor of frame and frames .
    • The revolution option now support optional object notation with x and/or y keys.
    • The images option now supports easy definition of sequence frames by one path string with a counter placeholder.
  • Events
    • New event openingDone now announces the end of opening animation » Github issue GH-65
    • Internal event slide renamed to pan » Github issue GH-51
    • Control event play now accepts optional speed parameter.
    • New events stepLeft and stepRight for doing just that » Github issue GH-20
Version 1.1.4
  • Patches incompatibility issues with jQuery 1.7 in IE » Github issue GH-93
  • Patches mouse wheel issues in IE. Upgrade of mousewheel plug-in is required » Github issue GH-105
Version 1.1.3
  • Promptly resolves sudden incompatibility with new jQuery 1.6 » Github issue GH-32
  • Enhanced test for by testing for CSS value equivalency rather for string equality » Github issue GH-33
  • `leader` tests Opera bug fixed » Github issue GH-34
Version 1.1.2
  • All known Internet Explorer bugs fixed:
    • Fixed two issues preventing Reel from animating itself in IE » Github issue GH-30
    • Fixed iframe-related bug in IE » Github issue GH-25
    • Fixed broken-image-overlay bug when using sprite on IE 7 and lower.
    • Fixed the overgrown indicator bug in IE 6.
  • Unwanted brief image disappearance of image on start eliminated.
  • Sprite request duplication eliminated for Firefox and others.
  • Laziness factor has been adjusted for better performance on iPhones.
  • Revised adaptive ticker:
    • Ticker is now driven by a "leader" - the oldest living instance on page - and `$.reel.leader` references its data. This removes the first-reel-sets-the-tempo limitation in older versions.
    • Overall `$.reel.cost` per timer tick in ms is being continuously calculated and then used to elevate timer accuracy.
    • Several performance tests included.
Version 1.1.1
  • Per document `$.reel.touchy` and `$.reel.lazy` properties added to manifest key user agent qualities.
  • Animation timer now automatically adapts to your viewer's device performance to stay in sync.
  • Vertical page scrolling now possible in Safari on iOS » Github issue GH-7
  • Initial frame 1 now doesn't disappear after loading » Github issue GH-11
  • New `center` store key now stores if on the center point in orbital setups.
  • iPad has been excluded from "lazy" devices list, because it in fact isn't lazy device at all. This means much fluent experience on iPads.
Version 1.1
  • Animation
    • The projector can now self-animate. The animation is controlled with bunch of options.
      • delay option for autoplay delay (use -1 to prevent it).
      • speed option sets the speed of animation (in Hz).
      • rebound options is how long in seconds will a non-looping reel stay on edge before bouncing back from it.
      • timeout option is a period of user inactivity after which animation is resumed again.
    • To control the animation from outside, new events `"play"`, `"pause"` ańd `"stop"` have been added.
    • Having one shared ticker for animation purposes. tempo option sets the speed in ticks per second.
    • Slower devices are detected and their tempo is decreased accordingly for better performance.
    • Duration of an opening animation is set using new opening option. Custom opening speed can be set using new entry option.
  • Rendering
    • Suggestive open/closed palm cursor used for mouse pointer over the projector.
    • iPhone downsizing bug is gone, however it decreases visual quality to fit in memory.
    • Image(s) loading status is now indicated by a horizontal progress bar at the bottom of the image. Height of the loader indicator can be adjusted by using new preloader option.
    • Added monitor option accepting a string key of any value stored within. It is then displayed in the upper left corner of the viewport.
    • Teardown sequence now wipes out everything.
  • Math
    • Decimal fraction is now used as a base for internal computations instead of using frames.
      • steps option divides Reel into different amount of steps other than defined by frames.
      • step option can be used to override initial frame option.
      • revolution option is a pixel distance mouse drag has to travel for full revolution.
  • Events
    • Instance now emits "loaded" event after image(s) preloading is done.
    • Internal data storage now report every manipulation by "store" or "recall" events. Name and value are passed as additional params to the handler.
  • Interaction
    • New draggable , wheelable and throwable options added for interaction style control.
    • New boolean clickfree option which causes binding to mouseenter/leave events rather than down/up for click-free interaction.
    • Prevented text selection of the projector on iPhone.
  • Multi-Row Object Movies
    • You can no go beyond the simple 360° with support for multiple horizontal rows.
      • rows option sets the vertical rows count.
      • row the initial row on which to start.
  • Dual-Axis Object Movies
    • New orbital option allows to specify centering tolerance and the movie is switched to dual-axis mode for one horizontal plus one vertical orbit.
  • Sequence of Images
    • Added the image option which allows custom image sprite to be used.
    • Array of individual images can now be supplied instead of using a collective sprite - this feature effectively overcomes the memory limit on iPhone imposed on large JPEG sprites exhibited by downsizing the sprite. See FAQ for more on this.
  • Other Options
    • All default options are now made available for manipulation as `$.reel.def` object.
    • The `sensitivity` option has become obsolete and had been removed.
    • The problematic `saves` option does no longer make sense (as there is no other option) and had been removed all together.
    • The hotspot option deprecated in favor to new area to stop being misleading.
    • New directional boolean option to flag bi-directional sprites.
    • New laziness option allows to customize the tempo divisor for lazy devices.
  • Content Delivery Network
    • Reel's own cloud CDN has been started and recommended for use instead of download.
    • For convenience, a "bundle" is available on the http://code.vostrel.cz/jquery.reel-bundle.js and it contains Reel along side with jQuery.mouseWheel and jQuery.disableTextSelect optional plugins.
  • As of this release the minimal version of jQuery has been increased to 1.4.2.
Version 1.0.4
  • Added long awaited support for iPhone/iPad/iPod family of touch-enabled devices.
  • Fixed miscalculation bugs GH-4 and GH-6 in stitched panoramas.
  • Added teardown event for effective reversal of initialization and to pair setup.
  • As of this release the minimal version of jQuery has been increased to 1.4.x.
  • Added very preliminary test suite. Hurray!
  • Added compatibility with another nice mouse wheel plugin, Three Dub Media's $.event.special.wheel.
Version 1.0.3
  • User neptune (thanks!) found a nasty mishap where option tooltip was used instead of hint on several places. To stay backwards compatible tooltip will stay as an alias of new option hint (which is preferred).
Version 1.0.2
  • Added support for counter-clockwise sprite by specifying option reversed
  • Validation of tags on which reel is applied added. Only IMG tags with assigned all src, width and height pass.
Version 1.0.1
  • Support for more classical stitched panoramic images added the stitched option accepting pixel length (width) of stitched panoramic reel image.
  • Mouse wheel sensitivity handling was improved.
  • Indicator now displayed without any extra CSS.
  • Fixed corrupted detection of movement direction.
  • Added new sensitivity option which enables control over sensitivity of mouse interaction.
  • Polishing options.
    • Added hint option to allow custom tooltip instructions to be displayed on hotspot(s).
    • The panorama option has been removed.
    • Added klass option to allow custom CSS class on plugin instance.
    • Option suffix default value changed from "-sheet" to "-reel".
    • Option save corrected to saves
  • Added new hotspot option accepting a jQuery. It allows binding mouse interaction events to custom DOM node.
Initial version 1.0
Expand entries for older versions »
back up

Badge for your site

4 badges available, GIF, small and served fast from CDN location.