JSFiddle - React, Tailwind, and code Playground

HTML

<div class="slideshow">
    <div class="promotion one">
        <p>Lorem Ipsum Dolor Sit Amer
            <a href="#">Link</a>
        </p>
        <img src="http://www.placehold.it/100x300" />        
    </div> 
    <div class="promotion two">
        <p>Lorem Ipsum Dolor Sit Amer
            <a href="#">Link</a>
        </p>
        <img src="http://www.placehold.it/100x300" />      
    </div>      
    <div class="promotion three">
        <p>Lorem Ipsum Dolor Sit Amer
            <a href="#">Link</a>
        </p>
        <img src="http://www.placehold.it/100x300" />    
    </div>     
</div>

CSS

.slideshow {width:630px; height:400px; display:block; overflow:hidden;}
.slideshow .one p {background:red; height:300px; width:300px; float:left;}
.slideshow .two p {background:blue; height:300px; width:300px; float:left;}
.slideshow .three p {background:green; height:300px; width:300px; float:left;}
.slideshow .one img {float:right; position:absolute; bottom:-300px;}
.slideshow .two img {float:right; position:absolute;bottom:-300px;}
.slideshow .three img {float:right; position:absolute;bottom:-300px;}
.slideshow .promotion {display:none;}
.slideshow .one {display:block; position:absolute; top:0; left:0;}
.slideshow .two {display:none;position:absolute; top:0; left:0;}
.slideshow .three {display:none;position:absolute; top:0; left:0;}

JavaScript

$(document).ready(function(){
    
    
    $(".one").each(function(index) {
       $(this).hide();
       $(this).delay(500 * index).fadeIn(5000).fadeOut();
    });

    $(".two").each(function(index) {
       $(this).hide();
       $(this).delay(1500 * index).fadeIn(10000).fadeOut();
    });
    
    $(".three").each(function(index) {
       $(this).hide();
       $(this).delay(1500 * index).fadeIn(15000).fadeOut();
    });

   
    
    // ANIMATION ONE
    
    $(".one p").fadeIn('slow', function() {
        // Animation complete
      });
    $(".one img").animate({ 
       bottom: "+=300px",
    }, 500 );
    
    
    
    // ANIMATION TWO
    
    $(".two p").fadeIn('slow', function() {
        // Animation complete
      });
    $(".two img").animate({
       bottom: "+=300px",
    }, 500 );
    
    
    
    // ANIMATION THREE
    
    $(".three p").fadeIn('slow', function() {
        // Animation complete
      });
    $(".three img").animate({
       bottom: "+=300px",
    }, 500 );
    
 
})