JSFiddle - React, Tailwind, and code Playground

by James Brown

HTML

<div id="div1">
    <div id="div2"></div>
</div>
<div id="div3"></div>
<p>How can i make div2 appear on screen?</p>

CSS

#div1
{
position:absolute;
    width:200px;
    height:200px;
    background-color: yellow;
    left:0px;
    top:0px;
    z-index:3;
}

#div2
{
position:absolute;    
    background-color:green;
    left:30px;
    top:30px;
    width:30px;
    height:30px;
    z-index:2;
}

#div3
{
    position:absolute;
    left:200px;
    top:0px;
    width:200px;
    height:200px;
    background-color:red;
    z-index:1;
}

JavaScript

var left = 0;
var div = document.getElementById("div2");
window.setInterval(function()
                   {
                  div.style.left = left + "px";
                       left = (left + 5) % 370;
                   }, 30);