no-image

JavaScript

ダイナミックに回転してコンテンツが切り替わる「Page Scroll 3D」

Page Scroll 3Dは、クルッとダイナミックに回転してコンテンツが切り替わるjQueryプラグインです。ナビゲーションによる切り替えやスクロールでの切り替えも可能です。

Page Scroll 3D

デモ

デモではフルスクリーンによる迫力ある画像が表示されています。右側にはナビゲーションメニューが設置されていて、ここから各コンテンツへ切り替えることができます。

任意の項目をクリックすると、そのセクションまでクルッと立体的に回転して移動します。画面全体が回転するのでとてもダイナミックな印象です。また、ナビゲーションからだけではなく、上下にスクロールすることでもコンテンツを切り替えることが可能です。

各コンテンツはそれぞれsectionタグ括るようにマークアップしていきます。使い方、マークアップともにシンプルなので手軽に実装できるのがいいですね。

ダイナミックな3Dアニメーションでコンテンツを切り替えるWebページを作りたいという人は、ぜひ「Page Scroll 3D」をチェックしてみてはいかがですか?

Multi-Step-Form-Jsステップごとにフォームをバリデーションしてくれる「Multi-Step-Form-Js」前のページ

【iOS 11】iPhoneのコントロールセンターからナイトシフト(Night Shift)へ簡単にアクセスする方法次のページ

関連記事

  1. jQuery.mousetip

    JavaScript

    マウスの動きや位置に追従してくるツールチップを実装できる「jQuery.mousetip」

    jQuery.mousetipはマウスの動きや位置に追従してくる軽量の…

  2. JavaScript

    軽量で嬉しい!画像を拡大ズームしてくれるjQueryプラグイン「Leroy Zoom」

    Leroy ZoomというjQueryプラグインを使えば、画像を拡大ズ…

  3. JavaScript

    レスポンシブ対応で優雅なエフェクトが印象的なjQueryスライダー「Juicy Slider」

    レスポンシブに対応している軽量のjQueryスライダー「Juicy S…

  4. elmenu

    JavaScript

    レスポンシブ対応で軽量なハンバーガーメニューを実装できる「elmenu」

    elmenuはレスポンシブに対応した軽量のハンバーガーメニューを実装す…

  5. 2013年上半期jQueryプラグインまとめ

    JavaScript

    2012年に紹介したjQueryプラグインのまとめ

    当ブログで2012年にご紹介したjQueryプラグインをまとめてみまし…

  6. SVG 3D Tag Cloud jQuery Plugin

最近の記事

  1. RF85mm F2 MACRO IS STM
  2. Anker PowerWave Pad Alloy
  3. Anker Bolder LC30
  4. BG-R10

アーカイブ

PAGE TOP