Replies: 1 comment
-
Hi, the module works fine, here is an example for mouse animation. When using events in vue/nuxt, the best practice is to add them in the Also keep in mind that you will need some kind of raf or gsap.ticker for better performance. <template>
<div>
<div ref="cursor">Cursor</div>
</div>
</template>
<script>
export default {
mounted() {
this.mouseMounted()
},
beforeDestroy() {
this.mouseDestroyed()
},
methods: {
cursorAnimation(e) {
this.$gsap.to(this.$refs.cursor, {
x: e.pageX,
y: e.pageY,
})
},
mouseMounted(e) {
document.addEventListener('mousemove', this.cursorAnimation)
},
mouseDestroyed(e) {
document.removeEventListener('mousemove', this.cursorAnimation)
},
},
}
</script> |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hi!
I have an issue with this.$gsap on Nuxt.
It's unknow when i use it on a document.addEventListener, or in a OnRepeat:
=> Uncaught TypeError: Cannot read properties of undefined (reading 'to')
I tried this too (based on https://codepen.io/karlovidek/pen/yvxZjO):
And the this.$gsap on the OnRepeat function is undefined (=> Uncaught TypeError: Cannot read properties of undefined (reading 'set')
Thanks a lot!
Vincent
Beta Was this translation helpful? Give feedback.
All reactions