JSFiddle - React, Tailwind, and code Playground

HTML

<div class="banner-wrap">
    <ul class="banner">
        <li>
            <img src="http://responsiveslides.com/1.jpg" alt="" />
            <div class="blur-block">Текст для слайда №1</div>
        </li>
        <li>
            <img src="http://responsiveslides.com/2.jpg" alt="" />
            <div class="blur-block">Текст для слайда №2</div>
        </li>
        <li>
            <img src="http://responsiveslides.com/3.jpg" alt="" />
            <div class="blur-block">Текст для слайда №3</div>
        </li>
    </ul>
</div>
<script src="http://responsiveslides.com/responsiveslides.min.js"></script>
<script src="http://nbartlomiej.github.io/foggy/jquery.foggy.min.js">
    
</script>

CSS

/*Banner*/
 .banner-wrap {
    position: relative;
}
.banner {
    position: relative;
    list-style: none;
    overflow: hidden;
    width: 100%;
    padding: 0;
    margin: 0;
}
.banner li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0;
}
.banner li:first-child {
    position: relative;
    display: block;
    float: left;
}
.banner li img {
    display: block;
    height: auto;
    float: left;
    width: 100%;
    border: 0;
}
.banner li div {
    position: absolute;
    width: 50%;
    right:0;
    top:0;
    height: 100%;
    min-height: 100%;
}
.rslides1_tabs {
    position: absolute;
    left:0;
    bottom:0;
    z-index: 44;
}
.rslides1_tabs li {
    display: inline;
    float: none;
    margin-right: 5px;
}
.rslides1_tabs .rslides_here a {
    background: #ff003c;
    background: rgba(255, 0, 60, .8)
}
.rslides1_tabs li a {
    text-indent: -9999px;
    overflow: hidden;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    background: #fff;
    background: rgba(255, 255, 255, .8);
    display: inline-block;
    width: 13px;
    height: 13px;
}

JavaScript

$(function () {
    $(".banner").responsiveSlides({
        pager: true,
        pause: true,
        auto: false
    });
});

$('.banner li img').foggy({
    blurRadius: 5, // In pixels.
    opacity: 0.9, // Falls back to a filter for IE.
    cssFilterSupport: true // Use "-webkit-filter" where available.
});