LaravelLaravel & VueJsVueJs

TwentyTwenty Image Comparison For Vue.js



Description:

A vue.js image comparison library based on the jQuery TwentyTwenty plugin.

Usage:

Implement it in ES6.

import TwentyTwenty from 'vue-twentytwenty';

export default {
  // ...
  components: {
    TwentyTwenty
  }
  // ...
};
<TwentyTwenty
  before="before.jpg"
  after="after.jpg" />

Use it as UMD.

new Vue({
  el: '#app'
})

Default props.

before: {
  type: String,
  required: true
},
beforeLabel: {
  type: String
},
after: {
  type: String,
  required: true
},
afterLabel: {
  type: String
},
offset: {
  type: [String, Number],
  default: 0.5,
  validator: (value) => {
    return (value > 0 && value <= 1)
  }
}

Preview:

Download Details:

Author: mhayes

Live Demo: https://mhayes.github.io/vue-twentytwenty/

Download Link:

Official Website: https://github.com/mhayes/vue-twentytwenty

Last Update: November 24, 2017

Views Total: 0

Install:

# Yarn
$ yarn add vue-twentytwenty

# NPM
$ npm install vue-twentytwenty --save




Source link

★ READ ALSO ★  Improve the error output of console commands in a Laravel app

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Close