<script>
let display = false;
setInterval(() => {
display = !display
}, 1000)
function sin(node, params) {
const x = params.x || 300
return {
duration: 1000,
easing: t => t,
css: (t) => {
return `
transform: translate(${x * t}px, ${150 + Math.cos(t * (30 / Math.PI)) * (x / 2)}px);
`
}
}
}
</script>
<style>
.circle {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: #000000;
}
</style>
{#if display}
<p class="circle" transition:sin></p>
{/if}