Código JS
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
var offset = 00
$(window).on('load scroll', function(){
if( $(window).scrollTop() > offset ){
$('body').addClass('show')
}else{
$('body').removeClass('show')
}
})
</script>Código CSS Abóbora
selector {
opacity: 1;
transition all: 0.3s ease;
animation: flutuacao 8s;
animation-iteration-count: infinite;
}
@keyframes flutuacao {
0% {
transform: translate(0px,0px) rotate(5deg);
}
25% {
transform: translate(20px,50px) rotate(-10deg);
}
50% {
transform: translate(10px,0px) rotate(-5deg);
}
75% {
transform: translate(-20px,50px) rotate(-10deg);
}
100% {
transform: translate(0px,0px) rotate(5deg);
}
}
body.show selector{
opacity: 0;
}Código CSS Página
html {
overflow: hidden;
scroll-behavior: smooth;
}