SOURCE

$marquee = $(".marquee");
var width = $marquee.outerWidth();
var pWidth = $(".marquee-wrapper").outerWidth();

var basicSpeed=2000;
var speed1=basicSpeed;
var speed2 = (pWidth/width)*basicSpeed;

function marquee(){
  $marquee
  	.delay(300)
  	.animate({left:-width-3+"px"},speed1,"linear")
  	.animate({left:pWidth+"px"},0)
  	.animate({left:0},speed2,"linear",function(){
  		marquee();	
  	})  	
}


	marquee();

<div class="marquee-wrapper">
  <div class="marquee"></div>
</div>

.marquee-wrapper {
  box-sizing:border-box;
  border:1px solid red;
  width:100%;
  height:100px;
	position:relative;
  
}

.marquee {
  border:1px dashed green;
  height:50px;
  width:200px;
  transform:translateY(-50%);
  position:absolute;
  
  top:50%;
  box-sizing:border-box;
}