Bloque fijo
Aunque se puede hacer con CSS (position:fixed) para practicar puedes hacerlo con Javascript.
El bloque se mantendrá en una posición fija aunque hagas scroll en la página
Solución
<script>
function clavar(obj, posic)
{
let bloque =document.getElementById(obj);
bloque.style.top = window.scrollY + posic + "px";
}
</script>
<body onscroll="clavar('cuadro',100)">
<div id="cuadro" style="position:absolute; top:100px">
<p>Este contenido permanece fijo en la ventana. </p>
<p>Aunque hagas scroll vertical</p>
</div>
<div style="height:1000px">Testigo delscroll</p>
</body>
Explicación
El elemento body se vincula al evento scroll con la función clavar(). Esta función lleva dos argumentos: el id del bloque a fijar y la posición vertical.
Cuanod se hace scroll la propiedad de winodw.scrollY contiene el desplazameinto vertical. Este desplazamiento se suma a la posición del bloque para que no se desplace.
Como lo uso
En la página vincular body onscroll a la función clavar() con el id del bloque fijo y su posición como atributos.
En el ejemplo he colocado un bloque div bien alto para que la página sea suficientemente alta para que aparezca la barra de scroll.