on:2010年11月11日sponsors大きい画像を限られた領域内に表示し、Googleマップのようにマウスのクリックとドラッグでその画像をアニメーションでスライドできるスクリプトを紹介します。SpryMapデモページ[ad#ad-2]スクリプトはjQueryなどの他のライブラリは必要とせず、単独で動作します。他のライブラリに依存せずに動作する超軽量(3KB)のスクリプト。画像を表示する領域はピクセル単位で指定が可能。画像を最初に表示する座標を設定可能。スクロールのアニメーションの時間を設定可能。実装は簡単で、画像にidを指定して使用します。HTMLスクリプトでラッパーとなるdiv要素を追加します。divのclassはオプションで設定できます。/>JavaScript「spryMap.js」を外部ファイルとして記述し、下記のスクリプトを記述します。"mappy"});}画像に任意のclass「mappy」を付与しています。[ad#ad-2]SpryMapのオプションスクリプトのオプションは、下記のようになります。