Search code examples
javascriptvue.jsnuxt.jsscrollbarsmoothing

How to scroll to section with vue-smooth-scrollbar?


I'm creating a portfolio with nuxt.js and i'm using a node module which is vue-smooth-scrollbar to have a smooth scroll in my page content.

The problem is I don't know how to scroll to a specific element in my scrolling content because it is implementing a new way of scrolling with a translate3D.

Does anyone know if there is a function to this package so I can scroll to a specific container with an anchor?


Solution

  • The package you're talking about is 6 months old with no documentation and it's more aimed towards the actual smoothness of the scrollbars.

    My answer here is about how to scroll to a specific element in your page. This is also just 2kB so good enough.

    This being usable anywhere on the page

    VueScrollTo.scrollTo(this.$refs.regForm, 1000, { easing: 'linear' })
    

    You can of course also scroll to a hash.


    Otherwise, smooth scroll is also available in JS vanilla.