Before and After image script

JavaScript

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

Before and After image scriptはビフォーとアフターの画像を見比べることができるjQueryプラグインです。画像の中央には左右にスライドできるバーが設けられてあり、これを動かすことでBeforeとAfterの表示面積を変更することができます。

[ads_center]

Before and After image script

Before and After image script

Before and After image script

スライドバーをドラッグして左右に動かしてBefore・Afterを変更する以外にも、画像内の任意の場所をクリックしてもバーを移動させることができます。

2枚並べて見比べるのではなくて、1枚分のスペースでビフォーアフターをチェックすることができるので、場所を有効活用したい時にも役立ちますね。

というわけで、ビフォーアフター画像を実装できる「Before and After image script」のご紹介でした。

関連記事

  1. jquery-scrollstop

    JavaScript

    スクロールの開始・終了時のイベントを設定できる「jquery-scrollstop」

    jquery-scrollstopはスクロールの開始・終了時のイベント…

  2. Jquery modal box plugin
  3. FakeLoader.js

    JavaScript

    フルスクリーンでカッコいいローディングアニメーション・FakeLoader.js

    FakeLoader.jsはフルスクリーンでカッコいいローディングアニ…

  4. Select.js

    JavaScript

    セレクトボックスをオシャレにスタイリングしてくれるJS・CSSライブラリ「Select.js」

    Select.jsはセレクトボックスをシンプルでオシャレにスタイリング…

  5. EZ Plus

    JavaScript

    タッチにも対応した画像ズーム機能を実装できるjQueryプラグイン「EZ Plus」

    EZ Plusはタッチにも対応した画像ズーム機能を実装することができる…

  6. jQuery Accordion

    JavaScript

    シンプルで実用的なアコーディオン実装「jQuery Accordion」

    とてもシンプルで操作性のよいアコーディオン「jQuery Accord…

最近の記事

  1. Soundcore Ace A1
  2. cheero USB-C PD Charger 60W
  3. DY-S01
  4. OWL-QI10W04

アーカイブ

PAGE TOP