Vue.js directive that can scroll to elements on the page.

vue-scrollto

A Vue.js directive that can scroll to elements on the page.

Since v2.1.0 it doesn't require jQuery anymore, instead it uses window.requestAnimationFrame and bezier-easing for easing.

The package exposes some functions that you can use programatically.

Example

Install

With npm do:

$ npm install vue-scrollto --save

main.js

import vueScrollto from 'vue-scrollto'

Vue.use(vueScrollto)

*.vue

<template>
<div id="app">
<div>
    <!-- use vue-scroll-to directive to scroll to an element -->
    <button v-scroll-to="'#pokemons'">Go To Palet Town</button>
</div>
<div>
    <div id="pokemons">
        <h1>Pokemon story</h1>
        <p>The name Pokémon....</p>
    </div>
</div>
</div>
</template>

Result:

Find vue-scrollto on GitHub.