JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.jqueryscript.net/demo/Lightweight-jQuery-Background-Slideshow-Plugin-BgSwitcher/jquery.bgswitcher.js"></script>
<div class="box">
    <h1>hello</h1>
    <p>here is some basic text</p>
</div>
<h1>outside of div</h1>

CSS

body {
    margin:0;
    padding:0;
}
.box {
    padding: 20px;
    color:#fff
}

JavaScript

$(".box").bgswitcher({
  images: ["http://www.jqueryscript.net/demo/Lightweight-jQuery-Background-Slideshow-Plugin-BgSwitcher/demo/images/image_5.jpg", "http://www.jqueryscript.net/demo/Lightweight-jQuery-Background-Slideshow-Plugin-BgSwitcher/demo/images/image_4.jpg", "http://www.jqueryscript.net/demo/Lightweight-jQuery-Background-Slideshow-Plugin-BgSwitcher/demo/images/image_3.jpg"], // Background images
  effect: "fade", // fade, blind, clip, slide, drop, hide
  interval: 3000, // Interval of switching
  loop: true, // Loop the switching
  shuffle: false, // Shuffle the order of an images
  duration: 5000, // Effect duration
  easing: "swing" // Effect easing
});