Vue Scroll Fixed Navbar
A Simple vue scroll fixed navbar package which will help you to fix the top header or navbar while scrolling the screen.
Demo
Buy Me a Coffee
Installation
With build systems
npm install --save vue-scroll-fixed-navbar
yarn add vue-scroll-fixed-navbar
To make the plugin available globally
In your main.js
:
import VueScrollFixedNavbar from "vue-scroll-fixed-navbar";
Vue.use(VueScrollFixedNavbar);
To include only in specific components
import {VueScrollFixedNavbar} from "vue-scroll-fixed-navbar";
export default {
name: 'YourComponent',
components: {
VueScrollFixedNavbar
}
}
Usage
<template>
<VueScrollFixedNavbar>
your content
</VueScrollFixedNavbar>
</template>
API
Props
Name | Type | Default Value | Description | Required |
---|---|---|---|---|
isFixed |
Boolean |
true |
Defines whether to fixed the header or not. | false |
Example
In order to stop fixing the navbar or header pass props
<template>
<VueScrollFixedNavbar :isFixed="false">
your content
</VueScrollFixedNavbar>
</template>
Open Source License
You may use it under the terms of the MIT Licenses