v-slide-toggle

vue slide toggle directive

Usage no npm install needed!

<script type="module">
  import vSlideToggle from 'https://cdn.skypack.dev/v-slide-toggle';
</script>

README

v-slider-toggle

Install:

npm i -S v-slide-toggle

Introduction

Like the jquery's slideToggle().

img

How to use

<button v-st="{ ele: '#slideToggle', d: 150 }"></button>

<div id="slideToggle">
  ...
</div>


<script>
import { $slideToggle } from 'v-slide-toggle'

export default {
  directives: {
    st: $slideToggle
  },
}
</script>

// or global use
import slideToggle from 'v-slide-toggle'

Vue.use(slideToggle)

Options

  • ele: className or id
  • d: the animation's duration (ms)
  • fx: move's function, default is linear: (t, b, c, d) => c / d * t + b

Thanks to use!