JavaScript Vue
Clone or download
Latest commit 4556a87 Jan 24, 2018
Permalink
Failed to load latest commit information.
.github rebuilding Jan 23, 2018
config rebuild Jan 24, 2018
dist up Jan 24, 2018
examples rebuilding Jan 23, 2018
src up Jan 24, 2018
test rebuilding Jan 23, 2018
.babelrc rebuilding Jan 23, 2018
.eslintignore rebuilding Jan 23, 2018
.eslintrc.js rebuilding Jan 23, 2018
.gitignore rebuilding Jan 23, 2018
.npmignore rebuilding Jan 23, 2018
.travis.yml rebuilding Jan 23, 2018
CHANGELOG.md rebuilding Jan 23, 2018
LICENSE rebuilding Jan 23, 2018
README.md update README.md Jan 24, 2018
bower.json rebuilding Jan 23, 2018
package.json rebuild Jan 24, 2018

README.md

GitHub stars Build Status GitHub issues GitHub forks GitHub last commit license Twitter

NPM NPM

Vue-Touch-Ripple

Touch ripple component for Vue.

Example

Demo Page

CDN Example

Install

CDN

<script type="text/javascript" src="path/to/vue.min.js"></script>
<script type="text/javascript" src="path/to/dist/vue-touch-ripple.js"></script>
<link rel="stylesheet" href="path/to/dist/vue-touch-ripple.css"/>
<script type="text/javascript">
  Vue.use(window.VueTouchRipple, /* { default global options } */)
</script>

NPM

npm install vue-touch-ripple --save

Mount

mount with global

import Vue from 'vue'
import VueTouchRipple from 'vue-touch-ripple'

// import styles
import 'vue-touch-ripple/dist/vue-touch-ripple.css'

// mount with global
Vue.use(VueTouchRipple, /* {
  // default global options
  color: '#fff',
  opacity: 0.3,
  speed: 1,
  transition: 'ease'
} */)

mount with component

import { touchRipple } from 'vue-touch-ripple'

// import styles
import 'vue-touch-ripple/dist/vue-touch-ripple.css'

export default {
  components: {
    touchRipple
  }
}

Component

<template>
  <touch-ripple :speed="1" :opacity="0.3" color="#fff" transition="ease">
     <!-- your element... -->
     <h1>it's a h1 title</h1>
     <div>it's a div block</div>
  </touch-ripple>
</template>

Options

prop type default
speed Number 1
color String #fff
opacity Number 0.3
transition String ease-out

Author

Surmon