dualvue v1.0.6

DualVue

A React component for comparing two images with a slider.

Installation

npm install dualvue

Usage

Import

import { DualVue } from "dualvue";
import "dualvue/dist/style.css"; // Don't forget to import the styles

Basic usage with defaults

function BasicExample() {
  return (
    <DualVue
      firstImage="path/to/first/image.jpg"
      secondImage="path/to/second/image.jpg"
    />
  );
}

Custom styling example

function CustomExample() {
  return (
    <DualVue
      firstImage="path/to/first/image.jpg"
      secondImage="path/to/second/image.jpg"
      width="1000px"
      height="600px"
      style={{ border: "1px solid #ccc" }}
      className="custom-class"
    />
  );
}

Props