Before & After Sliderは、2つの画像をドラッグで比較できるモバイルベースのスライダーです。ハンドルスタイル、ラベル位置、画像フィルター、インタラクション方式など、ほとんどすべての要素を細かく調整することができます。プロジェクトの性質に合った高品質な結果を作り出せます。

主な機能

2つのラベル方式

スタティックラベルは好きな場所に自由に配置でき、スティッキーラベルはハンドルに固定してインタラクティブに演出することができます。

ラベルスタイルの完全なコントロール

フォント、色、背景、ボーダー、パディング、フィルターなど、すべてのテキスト要素をカスタマイズできます。ドラッグ時のフェードアウト/イン効果も含まれています。

画像フィルターとフェード効果

各画像にCSSフィルター（ぼかし、モノクロ、セピアなど）を個別に適用でき、ロード時には滑らかなフェードインアニメーションも設定できます。

ハンドルとスライダーのインタラクションコントロール

ハンドルのサイズ、アイコンの色、ドラッグバーの長さ、影など、細かなハンドルスタイルの調整が可能で、キーボード操作、リセット、ホバー反応などユーザーの行動に応じた反応も設定できます。

コンテナのカスタマイズ

フレームのボーダー、影、パディングなど、全体のコンポーネントスタイルを自由に調整できます。

追加説明

• ビューティー、製品リデザイン、イノベーション、医療画像比較など、すべての産業分野で適用可能です。

• react-compare-sliderを基に制作されており、性能も優れ、安定しています。