Warp drive jQuery plugin

JavaScript

ワープするようなエフェクトを実装できる「Warp drive jQuery plugin」

Warp drive jQuery pluginは、ワープするようなかっこいいエフェクトを実装することができるjQueryプラグインです。ファイル容量も軽量なほか、HTML5のCanvasをベースにしているとのこと。

マウスを動かせばそれに合わせて視点が追従

デモ

デモページにはいくつかのデモが設置されており、各デモにマウスオーバーすると、まるで宇宙空間をワープしているかのようなエフェクトを体感できます。マウスを上下左右に動かすことで、視点もそれに追従して移動します。

ワープ中はかなりダイナミックな動きになるので、ユーザーにも強い印象を与えることができそうですね。

デモには黒、青、赤、緑、紫など、いろんな色のタイプが用意されています。1番下のデモには真ん中にロゴも表示させています。SFチックなデザインを採用しているサイトにはピッタリのプラグインといえるのではないでしょうか?

セッティングできるパラメーターはかなり豊富で、widthやheightをはじめ、autoResize、addMouseControls、addTouchControls、hideContexMenu、starCount、starBgCount、starColor、starfieldBackgroundColor、starDirection、starSpeed、starFov、starRotationPermission、starWarpLineLength、starFollowMouseSensitivityなど、他にもたくさんの項目が用意されています。

というわけで、ワープするようなSFっぽいエフェクトを実装したい人は、ぜひ「Warp drive jQuery plugin」をチェックしてみてください。

Warp drive jQuery plugin

Jquery Line Progress Bar横棒の軽量なプログレスバーを実装できる「Jquery Line Progress Bar」前のページ

イベント設定もできるシンプルなカレンダー実装「simple-calendar」次のページsimple-calendar

関連記事

  1. no-image

    JavaScript

    あらかじめ設定したリストなどから複数タグを選択できる「Tokenize2」

    Tokenize2は、あらかじめ設定したリストやAjaxから複数のタグ…

  2. ViewBox

    JavaScript

    レスポンシブに対応したLightbox風のイメージギャラリー「ViewBox」

    ViewBoxはレスポンシブに対応したLightbox風のイメージギャ…

  3. Maximum Characters limit exceeded warning
  4. no-image
  5. no-image

    JavaScript

    フロントエンドアプリケーションを構築するためのJSライブラリ「HyperApp」

    HyperAppは、フロントエンドアプリケーションを構築するための1K…

  6. Impulse Slider

    JavaScript

    3Dスライダーを実装できるjQueryプラグイン「Impulse Slider」

    Impulse SliderというjQueryプラグインを使えば3Dス…

最近の記事

  1. ゴムの耳栓
  2. ライオンコーヒー(バニラマカダミア)
PAGE TOP