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

MacのBluetooth表示名やコンピュータ名を変更MacのBluetoothの表示名やコンピュータ名を変更する設定方法前のページ

フォトアルバム(ブック)に最適なjQueryプラグイン「OneBook3d」次のページOneBook3d

関連記事

  1. no-image

    JavaScript

    シンプルで美しい軽量のjQueryモーダルウィンドウ「umodal」

    umodalはスッキリしたシンプルで美しいモーダルウィンドウを実装でき…

  2. CaptionerJs

    JavaScript

    画像に開閉できるキャプションを実装できるjQueryプラグイン「CaptionerJs」

    CaptionerJsは画像に開閉できるキャプションを実装することがで…

  3. no-image

    JavaScript

    マウスの動作に連動するシャドウエフェクト実装「Jquery Shadow Plugin」

    Jquery Shadow Pluginはマウスの動作に連動するシャド…

  4. JavaScript

    JavaScriptの配列操作をメモがてら整理してまとめてみる

    自分用のメモです。JavaScriptの配列操作に関するメソッドなんか…

  5. no-image
  6. Scrollgress

    JavaScript

    スクロールに連動するプログレスバーを実装できる「Scrollgress」

    Scrollgressはスクロールに連動するシンプルで軽量なプログレス…

最近の記事

  1. 甘柿
  2. 冬用のふとん
  3. 田沢湖
PAGE TOP