Points Of Interest

JavaScript

各ポイントごとにクリックで詳細文を表示させるjQuery「Points Of Interest」

Points Of Interestはサイト内に設置した各ポイントをクリックすることで簡単な詳細文を表示させることができるjQueryスクリプトです。プロダクトなどの特徴を素早く簡単に伝える時に役立ちますね。

[ads_center]

Points Of Interest

実際のデモは以下からどうぞ。

Points Of Interest

Points Of Interest デモ

+のアイコンをクリックすると、その部分に関する説明文が表示されます。

直感的にも操作しやすく、ユーザー自身が気になるポイントを選んで確認することができるので、プロダクトの特徴を迅速に理解しやすいですね。

テキストはサッとフェードで表示され、テキストが表示されている時は、プラスのアイコンがバツ印に切り替わります。

この辺りのさりげないエフェクトやアニメーションがいい感じです。

Points Of Interest

Before and After image scriptビフォーとアフターを見比べれるjQueryプラグイン「Before and After image script」前のページ

レスポンシブ対応のシンプルなLightbox風のjQueryプラグイン「Chocolat」次のページChocolat

関連記事

  1. Albe Timeline

    JavaScript

    JSONデータを用いたタイムライン実装「Albe Timeline」

    Albe TimelineはJSONデータを用いたカスタマイズ性の高い…

  2. Quttons

    JavaScript

    ボタンの形状やカラーが変化するjQueryプラグイン「Quttons」

    Quttonsはボタンをクリックすると形状やカラーが変化して新しいコン…

  3. PrognRoll

    JavaScript

    スクロールによるプログレスバーを表示できるjQueryプラグイン「PrognRoll」

    PrognRollはスクロールによるプログレスバーを表示することができ…

  4. jCider

    JavaScript

    レスポンシブ対応のjQueryカルーセルプラグイン実装「jCider」

    jCiderはレスポンシブ対応のシンプルなカルーセルを実装できるjQu…

  5. no-image

    JavaScript

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

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

  6. Light-Zoom

    JavaScript

    CSSを使用した画像ズームを実装できるjQueryプラグイン「Light-Zoom」

    Light-Zoomは純粋なCSSを使用した画像ズーム(拡大)機能を実…

最近の記事

  1. EOS R5
  2. Anker PowerExpand Direct 6-in-1 USB-C PDメディアハブ
  3. ペットボトルホルスター

アーカイブ

PAGE TOP