<template>
    <div class="BackTopBox animate__animated"
    :class="[scrollTop<400?'animate__fadeOutDown':'animate__fadeInUp']">
        <img class="cursor-pointer"  src="../../assets//img/backtop.png" 
            style="height: 58px;"
            @click="BackTop"/> 
    </div>
</template>
<script setup lang="ts">
import { ref, onMounted, reactive } from 'vue'
const props = defineProps({
    scrollTop:{
        type: Number,
        default: 0,
    },
})
const emit = defineEmits<{
    (event: 'BackTop'): void,
}>()
const BackTop = () =>{
    emit('BackTop')
}
</script>
<style lang="scss" scoped>
.BackTopBox{
    position: fixed;
    right: 5vw;
    bottom: 5vw;
    z-index: 15;
}
</style>