August 10, 2022

Click To Scroll Component using The Modern Browser API | VueNextLevelScroll

VueNextLevelScroll is a click-to-scroll component using the modern browser API.

javascript scroll to element by id, scrollintoview offset, scrollintoview javascript, javascript smooth scroll to element, react scroll to element

Features

  • Just one tiny file
  • Component-based (great for async loading and code splitting)
  • Supports navigation through VueRouter
  • Universal code/SSR-safe
  • Well-tested and documented
  • Compatible with Node 8.0+
  • Vue as the only dependency
  • Highly customizable

How to make use of it:

Install

$ npm install vue-next-level-scroll

Usage

import VueNextLevelScroll from 'vue-next-level-scroll'


export default {
  components: {
    VueNextLevelScroll
  }
}
export default {
  components: {
    VueNextLevelScroll: () => import('vue-next-level-scroll')
  }
}

Prop overview

PropOptional?Comment
targetCan be any query selector you want (or a function that returns such). Will be passed to the scroll function
tagDefaults to div. The HTML tag used for the VueNextLevelScroll component
scrollFunctionYou can define an own scroll function that will take the target prop as parameter and can do whatever you like.
shouldNavigateIf set, VueRouter will reflect navigation changes in the url(top: no hash, target: hash)
navigationTypeDefaults to push. The navigation type of that VueRouter should use. Usually either push or replace

click to scroll component library, VueNextLevelScroll Plugin/Github


See Demo And Download

Official Website(Developmint): Click Here

This superior jQuery/javascript plugin is developed by Developmint. For extra advanced usage, please go to the official website.

Share

You may also like...

Leave a Reply

Your email address will not be published.