Skip to content

evinkuraga/vue-scroll

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

82 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

vue-scroll

scroll directive for vuejs 2.0

For vue 1.x, please use [email protected]. Currently its code is in master branch.

NPM

Coveralls

npm package NPM downloads Average time to resolve an issue

Installation

NPM(recommended)

npm install vue-scroll --save

Standalone

Standalone bundle is not support on latest v2.1.0 currently

Simple download from releases and include it in script tag.

Get started

import Vue from 'vue'
import vuescroll from 'vue-scroll'

Vue.use(vuescroll)

Directive v-scroll then can be used in any of your Component.

<template>
  <ul v-scroll="onScroll">
    <li></li>
  </ul>
</template>
...

Method onScroll receives two arguments once scroll event is fired,

  • e - event
  • position - Object contains scrolling data
    • scrollTop Number
    • scrollLeft Number

Advanced

throttle and debounce are supported since v2.1.0, you can enable it as global configurations like:

Vue.use(vuescroll, {throttle: 600})
//Or
Vue.use(vuescroll, {debounce: 600})

Override global configurations like

<ul v-scroll:throttle="{fn: onScroll, throttle: 500 }">
<ul v-scroll:debounce="{fn: onScroll, debounce: 500 }">

Demo

Below two demos are uncommonly used and outdated.

LICENSE

MIT

About

Scroll directive on vue

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%