PopCircle

JavaScript

クリック時に周りに画像が表示されるイメージギャラリーを実装できるjQueryプラグイン「PopCircle」

PopCircleというjQueryプラグインを使えば、要素をクリックした時に周りに画像を表示させることができます。見た感じとっても面白いイメージギャラリーですね。ちょっと変わった見せ方をしたい時なんかによさそうです。

[ads_center]

PopCircleの使い方

実際のデモでは、このように、クリックすると周りに画像が「ポンッ」と表示されます。

PopCircle

PopCircle

$('.trigger').click(function(e){
    e.preventDefault();
    $.popcircle('#pops',
      {
        spacing:'10px',
        type:'full', // full, half, quad
        offset:1.95, // 0, 1, 2, 3, 4, 5, 6, 7 or 5.1
        ease:'easeOutElastic',
        time:'slow' // slow, fast, 1000
      }
    );
});

オプションでtypeをhalfにすると半円側だけに画像を表示したりするといったこともできます。

WordPressのログイン時のツールバーWordPressでアイキャッチ画像のサイズによって出力を振り分ける条件分岐のやり方前のページ

Photoshopで写真画像のExif情報を削除するやり方次のページ

関連記事

  1. qpScroll
  2. jquery.xtr

    JavaScript

    クライアントサイドで変換してくれる「jquery.xtr」

    jquery.xtrはページのリフレッシュなしにクライアントアイドでテ…

  3. Sidr

    JavaScript

    横からサイドメニューが現れるjQueryプラグイン「Sidr」

    面白いjQueryプラグインがあったのでメモがてらご紹介します。Sid…

  4. Footnoted

    JavaScript

    脚注(注釈)を入れたい時に役立つjQueryプラグイン「Footnoted」

    FootnotedというjQueryプラグインは文章の中に脚注(注釈)…

  5. radialIndicator

    JavaScript

    シンプルな円形のインジケーターを実装できるjQueryプラグイン「radialIndicator」

    radialIndicatorはシンプルで美しい円形のインジケーターを…

  6. TOAST UI Chart

    JavaScript

    多彩なチャートを描画できる「TOAST UI Chart」

    TOAST UI Chartは多彩なチャートをWebページに描画できる…

最近の記事

  1. サーモンアボカドサラダラップとドリップ
  2. 猿田彦フレンチ
  3. Zarigani Curry 挽肉のカレー ゴーダチーズとピクルスを添えて
  4. ビジネスホテル
  5. ドリップコーヒー

アーカイブ

PAGE TOP