Edit in JSFiddle

<div id="container">
  <div id="target"></div>
</div>
<button type="button" onclick="play()">Play</button>

#container {
  overflow: hidden;
  height: 100px;
  width: 100px;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEX/TQBcNTh/AAAACklEQVR4nGNiAAAABgADNjd8qAAAAABJRU5ErkJggg==);
  background-repeat: no-repeat;
  background-position: right top;
  background-size: 42px 100px;
}
#target {
  display: none;
  background-color: blue;
  height: 100px;
  width: 100px;
}
@keyframes anim {
   0% { transform: translate(100%, 0); }
 100% { transform: translate(0, 0); }
}

window.play = function() {
  target.style.display = 'none';
  window.setTimeout(function() {
    target.style.display = 'block';
    target.style.animation = '0.5s linear 0s anim';
  }, 200);
};
play();