vue-imagefill

0.2.1 • Public • Published

vue-imagefill

A Vue.js 2.0 images fill directives

Install

$ npm install vue-imagefill

Usage

<template>
  <div>
    <div class="image-wrap" v-flex="1">
      <img v-center="img">
    </div>
  </div>
</template>
import Vue from 'vue'
import vueImagefill from 'vue-imagefill'
import 'vue-imagefill/src/style/vue-imagefill.css'
Vue.use(vueImagefill)
 
export default {
  data () {
    return {
      img: require('~/assets/images/text.jpg')
    }
  }
}
.image-wrap {
  width: 200px;
  overflow: hidden;
  margin: 150px auto;
}
img {
  width: 100%;
}

demo

Options

directives description default options
v-flex image scaling. width/height, example: v-flex="150/200" 1 Number
v-center image src or none

Package Sidebar

Install

npm i vue-imagefill

Weekly Downloads

47

Version

0.2.1

License

ISC

Unpacked Size

41.1 kB

Total Files

16

Last publish

Collaborators

  • huadichan