<div id="myDiv" style="left: 0px;"></div>
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700italic);

html,body {
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(135deg,  #EA5C54  0%,#bb6dec 100%);
}

#myDiv {
  height: 100px;
  width: 100px;
  background-color: darken(#f09, 30%);
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translate(0, -50%);
}
const myDiv = document.getElementById('myDiv')

myDiv.addEventListener('click', () => {
  let Timer = setInterval(() => {
    if(parseInt(myDiv.style.left) > 200) {
      clearInterval(Timer)
      return false
    }
    myDiv.style.left = parseInt(myDiv.style.left) + 5 + 'px' 
  },16)
}, false)
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.