JavaScript

スライド機能がついたプロダクトギャラリーを実装できる「Product Preview Slider」

Product Preview Sliderはスライド機能がついた便利なプロダクトギャラリーを実装することができます。個別の製品ごとにスライダーがついているので、ユーザーにとっても色んなパターンの商品画像が見れて安心できそうですね。

Product Preview Slider

以下はProduct Preview Sliderのデモになります。

Product Preview Slider

デモ

商品にマウスオーバーすると前後にある画像が端の方に表示されるので、それをクリックする(もしくは画像下にあるナビゲーションをクリック)とスライドします。

色違いの商品、各部分のパーツ、様々な角度からの画像などなど工夫次第でとても便利なプロダクトギャラリーを実装できそうですね。

ユーザーにとって「知りたい情報」がしっかりと載っていると購入時にとても安心しますからね。

各商品ごとにスライダーを搭載できるので、「商品一覧を見ながら気になったものをその都度スライダーでチェックする」ということを1つのページ内でできるのがとても便利です。

そんなわけで、スライダーを活用したプロダクトギャラリーを実装したい方は是非チェックしてみてください。

Product Preview Slider

関連記事

  1. jQueryを使わないコード集

    JavaScript

    jQueryを使わないでコードを書くTips集

    jQueryを使えば簡単にできることがたくさんあるんですが、ちょっとし…

  2. PleaseWait

    JavaScript

    ローディングアイコンをオシャレに実装することができる「PleaseWait」

    PleaseWaitはローディングアイコンをオシャレに見せることができ…

  3. JavaScript

    JavaScriptの基本構文を忘れた!って時にサクっと見たい10項目

    最近はよくjQueryプラグインを使ったりすることが多くなってきたので…

  4. LC Micro Slider
  5. no-image
  6. no-image

    JavaScript

    さまざまなデバイスに対応したパララックスを実装できる「PARALLAX」

    PARALLAXは、さまざまなデバイスに対応したシンプルなパララックス…

最近の記事

  1. Olli
  2. 単語帳メーカー(Flashcard Maker App)
  3. 1Password 7
  4. 風に揺れる草

Facebookページ

PAGE TOP