WEBLEB
Início
Editor
Entrar
Pro
Português
English
Français
Español
Português
Deutsch
Italiano
हिंदी
falha na máquina da realidade
376
ByBy.inc
Abrir no Editor
Publique Seu Código
Recomendado
15 October 2024
Sobre a página
21 September 2024
Controle deslizante de viagem rotacional
6 August 2025
Desfoque progressivo modal
HTML
Copy
Loading...
CSS
Copy
* { margin: 0; padding: 0; box-sizing: border-box; } body { background-color: #000; display: flex; align-items: center; justify-content: center; height: 100vh; overflow: hidden; } .codigo { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: #272822; color: #F8F8F2; font-family: 'Consolas', 'Monaco', monospace; font-size: 18px; padding: 20px; border-radius: 8px; white-space: pre-line; text-align: left; line-height: 1.6; max-height: 50%; width: 100%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } .selector { color: #F92672; } .property { color: #66D9EF; } .value-number { color: #AE81FF; } .value-string { color: #E6DB74; } .value-color { color: #A6E22E; } .brace { color: #F8F8F2; } .comment { color: #75715E; } .function { color: #A6E22E; } .animation-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; width: 100%; height: 50%; overflow: hidden; background-color: #000; } /*--------------------*/ /* 100s de recarregos... */ .infiniteLoop { position: absolute; width: 100%; height: 100%; top: 0; left: 0; animation: loop 15s linear infinite; } @keyframes loop { 0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); } } .screen{ position: absolute; width: 80%; height: 80%; animation: scrollStop 30s linear infinite; /* Defina a posição inicial de cada tela */ top: 50%; left: 50%; transform: translate(-50%, -50%); /* Exemplo: tela inicial vista, tela 2 - conteúdo vazio */ background-color: #333; border-radius: 10px; } .content-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; } .content { font-family: 'Arial', sans-serif; color: #fff; text-align: center; font-size: 2em; } /* # Animação do Scroll Paralisia Simulation */
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */