Is there a way to display the button with the id backtotop only when the user has scrolled more than 250 pixels?
This is my code:
<template>
<div>
<button v-if="checkScroll" class="goTop" @click="backToTop">
<i class="fa fa-angle-up" aria-hidden="true"></i>
</button>
</div>
</template>
<script>
export default {
methods: {
computed: {
checkScroll() {
if ($(document).scrollTop() > 250) {
return true;
} else {
return false;
}
}
},
backToTop() {
this.$scrollTo('html');
},
}
}
</script>
I've implemented the code above but it's not working as expected. The button remains hidden even when I scroll beyond 250 pixels and I'm not getting any errors.