1.0.4 • Published 7 years ago
vue-read-progress v1.0.4
vue-read-progress
Vue.js plugin for scroll position with a progress bar indicator
Demo
https://ajerez.github.io/vue-read-progress/
Installation
With npm (Recommended)
npm i vue-read-progressyarn
yarn add vue-read-progressUsage
Default style
<template>
<vue-read-progress></vue-read-progress>
<!-- Your page content -->
</template>
<script>
import VueReadProgress from "vue-read-progress";
export default {
components: {
VueReadProgress
}
};
</script>Customizing the Look and Feel
<template>
<vue-read-progress color="#32AAEA" opacity="0.5" height="10px" :shadow="true"></vue-read-progress>
<!-- Your page content -->
</template>
<script>
import VueReadProgress from "vue-read-progress";
export default {
components: {
VueReadProgress
}
};
</script>Available Options (All optional)
| Property | Type | Default value | Prop Description |
|---|---|---|---|
| height | String | 4px | Height of progress bar (optional) |
| color | String | #506888 | Color of progress bar (optional) |
| opacity | String, Number | 1 | Set opacity values from 0 to 1 (optional) |
| shadow | Boolean | false | Enable box-shadow for the progress bar (optional) |
License
This project is licensed under the terms of the MIT license