CodePen

HTML

            
              <div class="parent">
  <div class="slide-right"></div>
</div>
            
          
!

CSS

            
              .parent{
  position: relative;
  height: 130px;
  width: 37.96921875%;
  background: #00688B;
}
.slide-right{
  position: absolute;
  right: 0;
  background: #BFEFFF;
  height: 130px;
  width: 0px;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
$(document).ready(function(){
    reslide();
});


function reslide(){
  $('.slide-right').delay(1000).animate({width:'0'}, 600).delay(8000).animate({width:'100%'}, 200, function(){
setTimeout(reslide, 3000);
}); 
}
//3000 - show pause	
//8000 - delay before show again
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................