WEBLEB
Accueil
Éditeur
Connexion
Pro
Français
English
Français
Español
Português
Deutsch
Italiano
हिंदी
chargement de grillage d'œufs
862
byby.createsite
Ouvrir dans l'éditeur
Publiez votre code
Recommandé
16 April 2024
Carte HTML de l'application
7 January 2024
Indicateur de chargement pulsé CSS
5 March 2024
Animation de texte CSS
HTML
Copy
CSS
Copy
*{ margin:0; padding:0; box-sizing:border-box; } body { font-family: Arial, sans-serif; background: black; display: flex; flex-direction: column; align-items: center; justify-content:center; height: 100vh; width:100vw; } .container-frigideira { z-index:1; animation: mexerPanela 2.5s ease-in-out infinite; } .ovo-container{ z-index:-1; left:20px; top:85px; transform:rotateX(55deg); animation: sincronizarComPanela 2.5s linear infinite; } @keyframes sincronizarComPanela { 0%, 50% { transform: translateX(20px) translateY(45px) rotateX(55deg); } 75% { transform: translateX(20px) translateY(-100px) rotateX(55deg); } 85%{transform: translateX(20px) translateY(-100px) rotateX(225deg);} 100% { transform: translateX(20px) translateY(45px) rotateX(225deg); } } @keyframes mexerPanela { 0% { transform: translateX(0); } 10% { transform: translateX(-25px); } 20% { transform: translateX(25px); } 30% { transform: translateX(-25px); } 40% { transform: translateX(25px); } 45%{ transform:translateX(0); } 50% { transform: translateX(0) translateY(-10px); } 60% { transform: translateX(0) translateY(0); } 100% { transform: translateX(0); } } .frigideira { width: 120px; height: 35px; transform:rotateZ(180deg); background: linear-gradient(to bottom, #34495e, #2c3e50); clip-path: polygon(8% 0%, 92% 0%, 100% 100%, 0% 100%); position: absolute; } /* Cabo da frigideira */ .cabo { position: relative; left:150%; top: 50%; width: 80px; height: 8px; background: linear-gradient(to right, #8B4513, #A0522D); border-radius: 4px; }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */