[JS]画像の商品をドラッグとホイールで360度回転させるスクリプト -Reel

img要素で配置した画像をマウスのドラッグとホイール操作で、商品や風景をぐるっと360度回転させるスクリプトをPetr Vostřelから紹介します。

Reel
デモ

画像の回転はドラッグとホイールに合わせて、左右どちらでも回転が可能です。

画像はimg要素で配置されており、二枚の画像を使用します。

一枚目は、スタティックに配置されているデフォルトの画像です。

デフォルトの画像

二枚目は、回転に必要な画像です。
車がぐるっと回転するのには、下記のような画像を作成します。

回転に必要な画像（キャプチャは縮小）

パノラマにも対応しており、下記のような画像を用意すると設置できます。

パノラマ用の画像（キャプチャは縮小）

ReelはjQueryのプラグインのため、実装にはjquery.jsが必要です。