Programmatic scrolling

You can programmatically trigger scrolling in your application by using the goTo method found on the $vuetify object. This method supports several different types of target selectors, and options including smooth scrolling using built-in easing functions.


The goTo method takes two parameters target and options. target can be either a pixel offset from the top of the page, a valid css selector, or an element reference. options is an object that includes duration, easing, container, and offset.



Use with router

The goTo function can be individually imported and invoked anywhere. This is particularly useful when hooking up to vue-router.

import Router from 'vue-router'
import goTo from 'vuetify/lib/services/goto'

export default new Router({
  scrollBehavior: (to, from, savedPosition) => {
    let scrollTo = 0

    if (to.hash) {
      scrollTo = to.hash
    } else if (savedPosition) {
      scrollTo = savedPosition.y

    return goTo(scrollTo)
  routes: [

Ready for more?

Continue your learning with related content selected by the Team or move between pages by using the navigation links below.