Image Gallery Threejs

JavaScript

3D回転するカルーセルのイメージギャラリーを実装できるjQueryプラグイン「Image Gallery Threejs」

Image Gallery ThreejsというjQueryプラグインを使えば、3D回転しながらスライドするカルーセルのイメージギャラリーを実装できます。前後の画像をクリックすることで回転しながら画像を見ていくことができます。

[ads_center]

Image Gallery Threejsの使い方

実際のデモは以下から確認することができます。

Image Gallery Threejs

デモ

画像を直接クリックすることでその画像までスライド移動することができます。他にも画面左上にあるprev・next、画像番号をクリックすることでも移動させることが可能です。

またデフォルトでは「default prespective」に設定されていて、水平方向にスライド表示されていきます。

それ以外では「top right prespective」と「top left prespective」があり、これらにすることで左右斜めに傾いたりします。

使い方はこんな感じです。画像パスやidをセットして使います。

$(function(){
  $(".sample").ig3js({
      manifest: [
          {src:"image1.jpg", id:"image1"},
          {src:"image2.jpg", id:"image2"},
          {src:"image3.jpg", id:"image3"}
        ],
        imagePath: 'images/'
    });
});

Image Gallery Threejs

関連記事

  1. jQuery Responsive Tabs
  2. jQuery_Overlay_Menu
  3. Images grid

    JavaScript

    画像のグリッドレイアウトを製作できるjQueryプラグイン「Images grid」

    Images gridは画像のグリッドレイアウトを製作するためのシンプ…

  4. Morphext

    JavaScript

    複数テキストをアニメーションで切り替えていくjQueryプラグイン「Morphext」

    MorphextというjQueryプラグインを使えば、複数テキストをア…

  5. jQuery Navobile
  6. ScrollBooster

    JavaScript

    ドラッグしながらスクロールするライブラリ「ScrollBooster」

    ScrollBoosterはドラッグしながらスクロールする機能を実装で…

最近の記事

  1. Anker PowerPort Atom PD 4
  2. USB-2H401BKN
  3. Dyson Pure Cool Me
  4. ルック セレクション

アーカイブ

PAGE TOP