Compare images with theTwentyTwenty component for Vue.js

vue-twentytwenty

Compare two images and see the differences between them with this Vue component. Using the image comparison utility the user can slide an overlay and observe changes.

Example

Installation

$ npm install vue-twentytwenty --save

Usage

import TwentyTwenty from 'vue-twentytwenty'

components: {
    TwentyTwenty
},
<TwentyTwenty
offset="0.9"
before ="//placehold.it/350x150/0288D1/FFFFFF"
beforeLabel="BEFORE"
after ="//placehold.it/600x200/E8117F/FFFFFF"
afterLabel="AFTER"  />

The repository is available on GitHub.