universal-tilt.js

JavaScript

パララックスなど多彩なチルト効果を実装できる「universal-tilt.js」

universal-tilt.jsはパララックスやスケールなど多彩なチルト効果を実装できるjQueryプラグインです。ホバーしてカーソルを動かすことで、それに連動する形でチルトします。インタラクティブなホバーチルトエフェクトを実装したい人にピッタリですね。

設定でモバイルにも対応

デモ

デモではさまざまなタイプのチルトエフェクトが用意されています。Shine、Scale、Parallax、Disable X、Disable Y、Reset (Only desktop)、Reverse、Position base (Only desktop)、Disable tilt on mobile、Change eventです。

ホバーしているところがシャインで光ったりパララックス効果を加えたり、カスタマイズ次第でいろんなエフェクトを取り入れれるのがいいですね。デスクトップだけでなく設定でモバイルに対応できるところもグッドです。

またオプションも豊富で、position-base、reset、mobile、shine、shine-opacity、shine-save、max、perspective、scale、disabled、reverse、speed、easing……などの項目が用意されているほか、X・Y・角度のアウトプットによるイベント設定も可能です。

universal-tilt.js

関連記事

  1. no-image

    JavaScript

    グリッドレイアウトによるシンプルで軽量なギャラリー「Grid Gallery」

    Grid Galleryはグリッドレイアウトによるシンプルで軽量なイメ…

  2. no-image

    JavaScript

    プレーンなJavaScriptによるレスポンシブなLightbox「jsOnlyLightbox」

    jsOnlyLightboxは、jQueryなどを必要としないプレーン…

  3. jQuery Equal Height

    JavaScript

    異なる要素の高さを揃えてくれる「jQuery Equal Height」

    jQuery Equal Heightは、異なる要素の高さをキレイに揃…

  4. Palette-js

    JavaScript

    美しいカラーパレッドを追加できる「Palette-js」

    Palette-jsは美しいカラーパレッドを手軽にプロジェクトに追加す…

  5. A simple jQuery Accordion with unlimited nesting

    JavaScript

    シンプルなアコーディオンを実装する「A simple jQuery Accordion with u…

    シンプルで見やすいアコーディオンを実装することができる「A simpl…

  6. jQuery Pit-scheduler v2.0

最近の記事

  1. BALMUDA The Pure
  2. BALMUDA The Pot Chrome

アーカイブ

PAGE TOP