[JS]CSSスプライトにスライドやフェードのアニメーションを加えるスクリプト -SpriteMenu

一枚の画像で作成するCSSスプライトに、スライドやフェードのアニメーションを加えるスクリプト「SpriteMenu」を紹介します。

デモのキャプチャ

SpriteMenu
demo

SpriteMenu

デモでは、イージングを使用したスライドとフェードのアニメーションが紹介されています。

使用している画像はどちらも同じで、下記のようになっています。

画像のキャプチャ

CSSスプライト用の画像(クリックで拡大)

ナビゲーションはリスト要素で実装されており、スクリプトのオプションではナビゲーションのサイズ、アニメーションのエフェクト、スピード、イージングなどを変更できます。

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

sponsors

top of page

©2018 coliss