vue-top

A simple Vue.js component to scroll your webpage to the top

Installation

npm install --save vue-top

Use with Single File Component

Globally

import VueTop from 'vue-top';

Vue.component('vue-top', VueTop);

Locally

import VueTop from 'vue-top';

export default {
  components: {
    ... ,
    VueTop,
  },
};

Use in Browser

Include js file in page

<script type="text/javascript" src="unpkg.com/[email protected]/dist/vue-top.min.js"></script>

Install as plugin

Vue.use(VueTop);

Usage

<vue-top>
  <!-- Your HTML CODE -->
</vue-top>

Example

<vue-top>
  <i class="fa fa-arrow-up" aria-hidden="true"></i>
</vue-top>

<vue-top>
  <img src="path/yourIcon.png"></img>
</vue-top>

Properties

Option	Type	Default	Description
bottom	String	30px	This property will convert to CSS style property which is the distance from bottom of browser edge
right	String	30px	This property will convert to CSS style property which is the distance from right of browser edge
speed	Number	500	Scolling speed , the smaller the faster
customStyle	Object	Null	Define your own style to the component