JSFiddle - React, Tailwind, and code Playground

by DmitrySemenov

HTML

<link rel="stylesheet" href="http://dimsemenov.com/plugins/royal-slider/royalslider/royalslider.css">
<link rel="stylesheet" href="http://dimsemenov.com/plugins/royal-slider/royalslider/skins/default/rs-default.css">
<script src="http://dimsemenov.com/plugins/royal-slider/royalslider/jquery.royalslider.min.js"></script>
<div class="royalSlider rsDefault">
 
    <div>Slide1</div>
    <div>Slide2</div>
</div>
<h2>Something</h2>

CSS

html,body,div {
    margin:0; padding:0;
}

html {
    overflow-x: hidden;
    overflow-y: scroll;
}


.royalSlider {
   width: 100%;
   height: auto;
    
   font-size: 100px;
}

JavaScript

var resize = function() {
    $('.royalSlider').css({
        width: $(window).width(),
        height: $(window).height()
    });
};

$(window).on('resize', resize);
resize();

var rs = $('.royalSlider').royalSlider({
    autoScaleSlider:false
}).data('royalSlider');