[JS]ダイナミックにウェブサイトをナビゲートするスクリプト -jQuery Panel Magic

グリッドあるいはマトリックスに配置したサムネイルを使用して、ダイナミックにウェブサイトをナビゲートするスクリプトを紹介します。

デモのキャプチャ

jQuery Panel Magic
デモページ

マトリックスに配置された各サムネイルをクリックすると、該当のパネルへアニメーションで遷移します。

デモのキャプチャ

デモ:個別パネル

別パネルへ遷移する際には、右下「SITEMAP」をクリックするとサムネイル一覧になります。

順番にクリックすると気がつかないのですが、飛び飛びでサムネイルをクリックすると、アニメーションの道順(?)がその通りになります。

対応ブラウザはFirefox3, IE6/7/8, Safari4とのことで、実装にはjQueryが必要です。

top of page

Trackback

leave your Comments

※承認制のため、即時には反映されません。
※匿名、通りすがりさんなどへの回答は控えさせていただきます。

Comments

freewebdev.jp

on 2010年8月5日

非常にダイナミックかつ印象的にウェブサイトをナビゲートするスクリプト

「jQuery Panel Magic」
画面遷移が非常に印象的な体験に変わるUIが実現出来るJSです。

グリッドあるいはマトリックスに配置したサムネイルを使用して、ダイナミックにウェブサイトをナビ…

E2 DESIGNERS BLOG:HTML,CSS,JavaScript,jQuery,FlashなどWebデザインに関するネタ紹介/株式会社E2

on 2010年8月5日

jQueryでSafariのTop Sites機能の様なインターフェイスを実現する「jquery-panel-magic.js」

SafariのTop Sites機能やiPadのブラウザインターフェースの様な、Webページをサムネイルとして一覧で表示させ、 クリックでページを拡大させるインターフェースを実現させる「jquery-panel-magic….

top of page

©2011 coliss