https://yunityagency.com Yunity Agency Wed, 29 Mar 2023 12:20:30 +0000 https://yunityagency.com en https://yunityagency.com/Accueil-Desktop Wed, 29 Mar 2023 12:20:30 +0000 Yunity Agency https://yunityagency.com/Accueil-Desktop Conteneur avec animation de fond body { margin: 0; padding: 0; min-height: 100vh; position: relative; } .gradient-container { position: absolute; bottom: 0; left: 0; width: 49.97vw; height: 8vh; background: linear-gradient(-45deg, #9c77d5, #c770af, #e73c7e, #9723d5, #d52376); background-size: 400% 400%; -webkit-animation: gradient 15s ease infinite; animation: gradient 15s ease infinite; opacity: 1; -webkit-mask-image: linear-gradient(to bottom, transparent, black 120px); mask-image: linear-gradient(to bottom, transparent, black 110px); mask-position: 0 0; mask-size: 100% 100%; mask-repeat: no-repeat; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } @-webkit-keyframes gradient { 0% { background-position: 0% 0%; } 25% { background-position: 0% 100%; } 50% { background-position: 100% 100%; } 75% { background-position: 100% 0%; } 100% { background-position: 0% 0%; } } @keyframes gradient { 0% { background-position: 0% 0%; } 25% { background-position: 0% 100%; } 50% { background-position: 100% 100%; } 75% { background-position: 100% 0%; } 100% { background-position: 0% 0%; } } .hidden { display: none; } Animation de texte /* Ajoutez ce code CSS à votre page HTML */ @keyframes changeText { 0% { content: "créativité."; } 50% { content: "potentiel."; } 100% { content: "créativité."; } } h2 h12:nth-child(1)::before { content: ""; } h2 h12:nth-child(1)::after { content: ".�0A0�0A0"; -webkit-animation: changeText 3s infinite; animation: changeText 3s infinite; } h2 h12:nth-child(2)::before { content: "Révélez votre "; } h2 h12:nth-child(2)::after { content: "."; -webkit-animation: none; animation: none; } Explorez votre Révélez votre génie. Yunity est une agence artistique et de coaching qui aide les créateurs à libérer leur potentiel. Nous offrons des services de coaching personnalisé et nous accompagnons les artistes dans le monde de l’art.&nbsp;L’art contemporain doit être aujourd’hui un art engagé dans l’humanité. .gradient-container2 { position: fixed; top: 0; left: 0; width: 100%; height: 7vh; background: linear-gradient(-45deg, #9c77d5, #c770af, #e73c7e, #9723d5, #d52376); background-size: 400% 400%; -webkit-animation: gradient 15s ease infinite; animation: gradient 15s ease infinite; opacity: 1; -webkit-mask-image: linear-gradient(to bottom, transparent, black 130px); mask-image: linear-gradient(to bottom, transparent, black 130px); mask-position: 0 0; mask-size: 100% 100%; mask-repeat: no-repeat; border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; } @-webkit-keyframes gradient { 0% { background-position: 0% 0%; } 25% { background-position: 0% 100%; } 50% { background-position: 100% 100%; } 75% { background-position: 100% 0%; } 100% { background-position: 0% 0%; } } @keyframes gradient { 0% { background-position: 0% 0%; } 25% { background-position: 0% 100%; } 50% { background-position: 100% 100%; } 75% { background-position: 100% 0%; } 100% { background-position: 0% 0%; } } .hidden { display: none; } window.onscroll = function() { scrollFunction(); }; function scrollFunction() { document.querySelector('.gradient-container').classList.toggle('hidden', window.pageYOffset < 100); document.querySelector('.gradient-container2').classList.toggle('hidden', window.pageYOffset < 100); }