JSFiddle - React, Tailwind, and code Playground

HTML

<div id="logo" class="demoStyle">LOGO</div>

CSS

#logo {
  position: absolute;
  top: 0;
  left: 100%;
  -webkit-animation: slide 1.5s forwards;
  -webkit-animation-delay: 0.5s;
  animation: slide 1.5s forwards;
  animation-delay: 0.5s;
}

.demoStyle {
  line-height: 50px;
  display: block;
  background: yellow;
  width: 3em;
  height: 50px;
}

@-webkit-keyframes slide {
  100% {
    left: 0%;
  }
  75% {
    left: 100%;
  }
  50% {
    left: 0
  }
  25% {
    left: 100%;
  }
  0% {
    left: 0%
  }
}

@keyframes slide {
  100% {
    left: 0%;
  }
  75% {
    left: 100%;
  }
  50% {
    left: 0
  }
  25% {
    left: 100%;
  }
  0% {
    left: 0%
  }
}

JavaScript

//var left = $('#coolDiv').offset().left;


//$("#coolDiv").css({left:left}).animate({"left":"0px"}, "slow");