JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="container">
        <div class="contentContainer red"></div>
        <div class="contentContainer blue"></div>
        <div class="contentContainer green"></div>
        <div class="contentContainer"></div>
    </div>
</div>

<div class="three"><h1>.</h1></div>
<div class="two"><h1>.</h1></div>
<div class="one"><h1>.</h1></div>

CSS

.wrapper {
    position: relative;
    width: auto;
    height: 200px;
    top: 0;
    left: 0;
    overflow: hidden;
}
.container {
    position: absolute;
    height: 200px;
}
.contentContainer {
    width: 540px;
    height: 200px;
    display: inline-block;
}
.red {
    background-color: red;
}
.blue {
    background-color: blue;
}
.green {
    background-color: green;
}

.one {
    float:right;
    cursor: pointer;
}
.two {
    float:right;
    cursor: pointer;
}
.three {
    float:right;
    cursor: pointer;
}

JavaScript

var check=0;
var timer;
var Wwidth=$(window).width()-9;

$(document).ready(function () {
$('.contentContainer').css({'width':''+Wwidth+'px'});
    
    $('.three').click(function () {
        $('.container').animate({
            'left': '-1120px'
        });
        clearTimeout(timer);
        timer=setTimeout(function () {$('.one').click();}, 1000);
    }); 
    
    $('.two').click(function () {
        $('.container').animate({
            'left': '-560px'
        });
        clearTimeout(timer);
        timer=setTimeout(function () {$('.three').click();}, 1000);
    });    
    
    $('.one').click(function () {
        $('.container').animate({
            'left': ''+0+'px'
        });
        clearTimeout(timer);
        timer=setTimeout(function () {$('.two').click();}, 1000);
    });  
    timer=setTimeout(function () {$('.two').click();}, 1000);
});

//Here we are getting the number of the divs with class contentContainer inside the div container
var length = $('div .container').children('div .contentContainer').length;
//Here we are setting the % width depending on the number of the child divs
$(".container").width(length*100 +'%');