jhealey5
12/19/2018 - 7:42 AM

ScrollTo.vue

<script>
import { TweenMax, ScrollToPlugin } from 'gsap/all';

export default {
  props: ['offset'],

  name: 'ScrollTo',

  mounted(){
    this.$el.addEventListener('click', this.scroll);
  },

  render(){
    return this.$slots.default[0];
  },

  methods: {
    scroll(e){
      let hash = e.currentTarget.hash;

      if (!hash) return;

      let target = document.querySelector(hash);

      if (!target) return;

      e.preventDefault();

      TweenMax.to(window, 0.6, {
        scrollTo: {
          y: hash,
          offsetY: this.offset || 100
        },
        ease: Power4.easeOut
      })
    }
  }
}
</script>