Componente · Janela móvel
O Window é o espelho do Fixed: em vez da imagem ficar parada e o conteúdo passar por cima, aqui é a moldura que se move pela página — como uma janela andando — enquanto a imagem dentro dela permanece opticamente ancorada no centro da tela. O resultado é a sensação de espiar a mesma cena por janelas diferentes.
Role devagar pelo quadro abaixo. As duas molduras (quadrada e redonda) se movem pela tela normalmente, mas repare que a imagem dentro delas não se desloca no mesmo ritmo — ela fica "grudada" no centro da janela do seu olhar, revelando uma fatia diferente da cena em cada instante.
Janela 01 · quadrada
Janela 02 · redonda, mesma imagem
Basta um <figure> (ou qualquer contêiner) com data-sw="window" e uma imagem filha direta dentro dele. O formato da janela — quadrada, redonda, retangular — é decidido só pelo seu CSS, não pelo atributo.
<figure data-sw="window" style="width:40rem;aspect-ratio:1;border-radius:50%">
<img src="paisagem.webp" alt="Descrição">
</figure>Assim como o Fixed, o Window não tem atributos próprios de ajuste. A moldura pode ter qualquer forma e tamanho — o efeito continua funcionando porque quem se move é o CSS da própria moldura, e o componente só cuida de manter a imagem visualmente ancorada.