JSFiddle - React, Tailwind, and code Playground

by Glynne Turner

HTML

<div id="container">
  <img class="bg" src="https://www.thanet-web-design.com/AGS-New/images/AGS1.jpg"/>
  <div id="content">
    <p>Lorem ipsum dolor sit amet</p>
    <p>Lorem ipsum dolor sit amet</p>
    <p>Lorem ipsum dolor sit amet</p>
    <p>Lorem ipsum dolor sit amet</p>
  </div>
</div>

CSS

body {
  width:100%;
  height:100%;
  display:block;
  margin:0;
  padding:0;
  background:red;
}
#container {
  display:block;
  width:100%;
  height:100%;
  position:relative;
}
#container img {
  width:100%;
  position:absolute;
  top:0;
  left:0;
  z-index:1;
}
#content {
  display:block;
  width:100%;
  height:100%;
  position:relative;
  z-index:2;
}
p {
  color:#ffffff;
}

JavaScript

$(document).ready(function(){
  $('.bg').animate({'width':'105%'}, 2000);
})