Exemplos
Animação de loading de pontos escalonados
HTML
CSS
JS
Resultado
Avançados
<div class="loader"> <div class="loader-dot"></div> <div class="loader-dot"></div> <div class="loader-dot"></div> </div>
.loader { display: flex; justify-content: center; align-items: center; height: 100px; } .loader-dot { width: 20px; height: 20px; border-radius: 50%; background-color: #333; margin: 0 10px; animation: loader-dot 1.5s infinite ease-in-out; animation-delay: calc(0.5s); } .loader-dot:nth-child(2) { animation-delay: calc(0.5s + 0.25s); } .loader-dot:nth-child(3) { animation-delay: calc(0.5s + 0.5s); } @keyframes loader-dot { 0% { transform: scale(1); } 50% { transform: scale(1.5); } 100% { transform: scale(1); } }
Marcus dev
Para usar
Cadastre-se
Código embed
Resultado
Avançados
Marcus dev
Para usar
Cadastre-se
Código embed
© 2023 Marcus Oliveira.
Ajuda do editor de HTML
, Aproveite todos os recursos!
Versões
Ajuda
Exemplos
APP
Editor de HTML
*A busca não retorna histórias
, para isso visite a página histórias
Digite aqui para obter os resultados da pesquisa!
Search
Search