読者です 読者をやめる 読者になる 読者になる

Noise of Web Programming

主にHTML/CSS/JavaScriptやWebサービスの情報を配信しています。可能な限り実装方法まで書いていくつもりです。

ブログを移転しました。

Tecuration.com

このサイト同様、HTML/CSS/JavaScriptなどのフロントサイドWeb開発に関する最新情報やライフハックを配信しています。

iTunesのcover flowのようなスライダーを実装する「sly.js」

Javascript ライブラリ

iTunes11からなくなってしまった「cover flow」機能のようなスライダーを実装することのできるJavaScriptライブラリが良かったのでご紹介。

Sly


cover flowって何ぞという人のためにDemoを。僕のiPodにはまだこの機能はあるなー。ボタンやパネルをクリックしてスクロールさせても良いし、マウスのスクロールホイールでもスクロールできる。動作が軽快!かっこいい!

Check out this Pen!

sly.jsでは他にもいくつかのスライダーを提供している。cover flow以外のDemoは以下参照。

Sly Horizontal Examples


実装方法は上記、CodePenから確認してほしい。こんなスライダーをサイトのTopページに設置したらかっこいいだろうなー。


編集後記:
GWですなー。酒飲みすぎてるので注意せねば。Google Chrome Extinsion開発に四苦八苦。

広告を非表示にする