back-to-top-davipereira v0.0.5

Vue.js and Nuxt.js Backtotop Component

Install via npm

npm i back-to-top-davipereira

Import and use

Import for global usage

import Vue from 'vue'
import BackToTop from 'back-to-top-davipereira'

Vue.use(BackToTop);
...

Or on a single component

import BackToTop from 'back-to-top-davipereira'
...
},
components: { BackToTop }
...

Props

Events

How to use

Currently, the vue-backtotop has a property named "text", that is the text which will be visible on button. The default value is "Voltar ao topo".

<back-to-top text="Back to top"></back-to-top>

The button to back to top become visible at window scroll at 600 > px. If you want to change this value, pass a property named "visibleOffset" with a number value.

<back-to-top text="Back to top" visibleoffset="500"></back-to-top>

You can also know when scroll ends

<back-to-top text="Back to top" @scrolled="myFunction"></back-to-top>

Now, it's possible to use your own html/vue component inside vue-backtotop component

<!-- in your template -->
<back-to-top bottom="50px" right="50px">
  <button type="button" class="btn btn-info btn-to-top"><i class="fas fa-chevron-up"></i></button>
</back-to-top>