Preloader [sw-pre]
Tela de carregamento em tela cheia que some automaticamente 200ms após a página terminar de carregar.
1. Uso
Ao carregar, o SW adiciona .is-out (transição de opacidade via CSS) e remove o elemento do DOM após 600ms.
2. Demo ao vivo
O preloader real já sumiu (a página já carregou) — cada botão abaixo mostra uma variante por ~1.6s e some sozinho com a mesma animação, só pra visualizar sem precisar recarregar a página.
Referência
| Atributo/Classe | Descrição |
|---|---|
[sw-pre] | Overlay de tela cheia — remove-se sozinho 200ms após o load. |
.is-out | Aplicada automaticamente para animar a saída (fade, 600ms). |
.sw-spinner | Anel giratório — o indicador padrão. |
.sw-pre-dots | 3 pontinhos saltitantes — precisa de 3 <span> filhos. |
.sw-pre-lbl | Texto opcional abaixo do indicador. |
.is-drk | Fundo escuro fixo (#0f0f0f), independente do tema. |
.is-pri | Fundo na cor primária — spinner/dots/label viram brancos. |
.is-bar | Fundo transparente, só uma barra de progresso animada no topo. |