JSFiddle - React, Tailwind, and code Playground

by albertt

HTML

<div id="texto1">texto1</div>
<div id="texto2">texto2</div>
<div id="texto3">texto3 </div>

CSS

#texto1{
			  font-family: Arial, Verdana, sans-serif; !important
			  font-size:99px;
			  text-align:center;
			  width:100%;
			  margin-top:10%;
			  display:none;
			}
			#texto2{
			  font-family: Arial, Verdana, sans-serif; !important
			  font-size:99px;
			  text-align:center;
			  width:100%;
			  display:none;
			  margin-top:10%;
			  }
			#texto3{
			  font-family: Arial, Verdana, sans-serif; !important
			  font-size:99px;
			  text-align:center;
			  width:100%;
			  display:none;
			  margin-top:10%;
			}

JavaScript

$(document).ready(function(){
   
			setTimeout(function(){
				$('#texto1').fadeIn(2000); 
				$('#texto1').fadeOut(2000);},1000);
			
			setTimeout(function(){
				$('#texto2').fadeIn(2000);
				$('#texto2').fadeOut(2000);}
				,7000);

			setTimeout(function(){
				$('#texto3').fadeIn(2000);
				$('#texto3').fadeOut(2000);}
				,12000);
				
		   setTimeout(function(){
				$('#texto4').fadeIn(2000);
				$('#texto4').fadeOut(2000);}
				,15000);
			  
			});