piège du tutoriel

Ouvrir dans l'éditeur Publiez votre code

Recommandé

18 December 2025

Chargeur HTML du jeu Boom Slingers ReBoom

17 May 2024

* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    body {
      background-color: #000;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
      overflow: hidden;
    }
    .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;
    }

.tutorial-box {
      position: relative;
      width: 100px;
      height: 100px;
      background-color: #222;
      border-radius: 10px;
      animation: tutorialPulse 1.5s infinite alternate ease-in-out;
    }

.tutorial-box::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(255, 255, 255, 0.1);
      animation: tutorialGlitch 1.5s infinite linear alternate;
    }

/*  Gatilhos: Loop infinito, atualização constante.

Visão: Simula a sensação de estar preso em um tutorial cíclico,
      começando com lógica, mas se contorcendo em elementos perturbadores
      */
    @keyframes tutorialPulse {
      0% {
        transform: scale(1);  
      }
      50% {
        transform: scale(1.1);  
      }
      100% {
        transform: scale(1);  
      }
    }

@keyframes tutorialGlitch {
      0% {
        clip-path: circle(50%);
      }
      50% {
        clip-path: circle(70% at 50% 50%); 
      }
      100% {
        clip-path: circle(50%);
      }
    }

piège du tutoriel

Recommandé

Chargeur HTML du jeu Boom Slingers ReBoom

manger du gibier

produit

HTML

CSS

JS

Recommandé

Chargeur HTML du jeu Boom Slingers ReBoom

manger du gibier

produit

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS