JSFiddle - React, Tailwind, and code Playground

HTML

<div class="carousel"> 
      <div class="carouselArrowLeft"><a href="javascript:void(0);"></a></div> 
      <div class="carouselArrowRight"><a href="javascript:void(0);"></a></div> 
      
      
            <div class="carouselWrapper"> 
               <div class="carouselLineBlocks"> 
               
                  <div class="carouselBlock">
                        <img src="http://www.loc.gov/rr/print/coll/images/utefamily220.jpg" alt="" />
                  </div>
                  
                  <div class="carouselBlock">
                        <img src="http://www.usa-morocco.org/images/hassan_sidi_ap.jpg" alt="" />
                  </div>
                  
                  <div class="carouselBlock">
                        <img src="http://btimes.ru/files/imagecache/Page/images/2013-02-20/images.jpg" alt="" />
                  </div>
                  
                  <div class="carouselBlock">
                        <img src="http://woodstreetgalleries.org/wp-content/uploads/2012/07/moving_images-220x170.jpg" alt="" />
                  </div>
                  <div class="carouselBlock">
                        <img src="http://oscarsden.com/blog/wp-content/uploads/2013/04/images4-220x170.jpg" alt="" />
                  </div>
                  <div class="carouselBlock">
                        <img src="http://i01.i.aliimg.com/wsphoto/v0/1470160297_1/free-shipping-Celebrity-Dress-Rihanna-2013-the-Grammy-Awards-Red-Carpet-Dresses-Sheer-Halter-Real-Images.jpg_220x220.jpg" alt="" />
                  </div>
                  <div class="carouselBlock">
                        <img src="http://alternate-politics.info/files/imagecache/related_nodes/images-1_0.jpg" alt="" />
                  </div>            
                  <div class="carouselBlock"> 
                        <img src="http://www.washington.edu/doit/Kb/Images/004_RDE_Collab_Images.jpg" alt="" />
                  </div>
				  
				  <div class="carouselBlock">
     ...

CSS

.carousel  {
outline: 1px solid red;
   position: relativ;
   width: 990px; 
   height: 235px;
   margin: 50px auto;
}
.carouselWrapper {
   width: 925px;
   overflow: hidden;
   position:relative;
   margin: auto;
   top: 30px;
   padding:0;
}
.carouselLineBlocks {
   width: 10000px; 
   position: relative; 
   padding: 0;
   margin-left: -5px;
}
.carouselBlock {
   float: left; 
   width: 220px; 
   height: 170px;
   margin: auto 7px; 
}


.carouselArrowLeft a, .carouselArrowRight a {
   width: 25px; 
   height: 36px; 
   position: relative;
   top: 100px; 
   cursor: pointer; 
   text-decoration:none;
}
.carouselArrowLeft a{
   float: left; 
   background: url(http://www.aflvicholidayprograms.com.au/slideshow/img/arrow-prev.png); 
}
.carouselArrowRight  a{
   float: right;
   background: url(http://www.aflvicholidayprograms.com.au/slideshow/img/arrow-next.png); 
}

JavaScript

$(".carouselArrowRight").live('click',function(){ 
	var carusel = $(this).parents('.carousel');
	rightCarusel(carusel);
});
   
$(".carouselArrowLeft").live('click',function(){ 
	var carusel = $(this).parents('.carousel');
	leftCarousel(carusel);
});

function leftCarousel(carusel){
   var block_width = $(carusel).find('.carouselBlock').width() + 14;
   $(carusel).find(".carouselLineBlocks .carouselBlock").eq(-1).clone().prependTo($(carusel).find(".carouselLineBlocks")); 
   $(carusel).find(".carouselLineBlocks").css({"left":"-"+block_width+"px"}); 
   $(carusel).find(".carouselLineBlocks").animate({left: "0px"}, 200); 
   $(carusel).find(".carouselLineBlocks .carouselBlock").eq(-1).remove(); 
};

function rightCarusel(carusel){
   var block_width = $(carusel).find('.carouselBlock').width() + 14;
   $(carusel).find(".carouselLineBlocks").animate({left: "-"+ block_width +"px"}, 200); 
   setTimeout(function () { 
      $(carusel).find(".carouselLineBlocks .carouselBlock").eq(0).clone().appendTo($(carusel).find(".carouselLineBlocks")); 
      $(carusel).find(".carouselLineBlocks .carouselBlock").eq(0).remove(); 
      $(carusel).find(".carouselLineBlocks").css({"left":"0px"}); 
   }, 300);
};

$(function() {
	autoScrolling('.carousel:first');
});

function autoScrolling(carusel){
	setTimeout(function(){
		rightCarusel(carusel);
		autoScrolling(carusel);
	}, 3500);
};