Efecto nubes con Elementor free

				
					<div class="stage" direction="right" style="height: 75vh;">
  <div id="clouds-1" class="clouds"></div>
  <div id="clouds-2" class="clouds"></div>
  <div id="clouds-3" class="clouds"></div>
</div>
				
			
				
					.stage {
    position: relative;
    top: 0;
    left: 0;
    overflow: hidden;
}
.clouds {
    position: absolute;
    width: 100%;
    height: 500px;
    top: 0;
    left: 0;
}
#clouds-1 {
  background: transparent url(https://torn.com/images/v2/travel_agency/clouds/clouds_3_row.png) left center repeat-x;
  animation: pan 80s linear infinite;

}
#clouds-2 {
  background: transparent url(https://torn.com/images/v2/travel_agency/clouds/clouds_1_row.png) left center repeat-x;
  animation: pan 120s linear infinite;
}
#clouds-3 {
  background: transparent url(https://torn.com/images/v2/travel_agency/clouds/clouds_2_row.png) left center repeat-x;
  animation: pan 60s linear infinite;
}
@keyframes pan {
  from {background-position: 0;}
  to {background-position: -2000px;}
}
				
			
Si para este tutorial necesitas algún plugin lo podrás encontrar en la pagina de plugins.
Comparte en tus redes sociales

Deja un comentario

Descripción general de privacidad

Este sitio web utiliza cookies para que podamos brindarle la mejor experiencia de usuario posible. La información de las cookies se almacena en su navegador y realiza funciones como reconocerlo cuando regresa a nuestro sitio web y ayudar a nuestro equipo a comprender qué secciones del sitio web le resultan más interesantes y útiles.