<html>
<body>
<main style="background: linear-gradient(yellow, blue); height: 250vh; transition: 10s;"></main>
<script>
window.addEventListener('scroll', () => {
const main = document.getElementsByTagName('main')[0]
main.style.height = "50vh";
})
</script>
</body>
</html>