JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.jquerytools.org/1.2.7/all/jquery.tools.min.js"></script>
<div style="margin:0 auto; width: 634px; height:120px;">
<!-- "previous page" action -->
<a class="prev browse left"></a>
 
<!-- root element for scrollable -->
<div class="scrollable">
 
  <!-- root element for the items -->
  <div class="items">
 
    <!-- 1-5 -->
    <div>
      <img src="http://farm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg" />
      <img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg" />
      <img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg" />
      <img src="http://farm1.static.flickr.com/28/66523124_b468cf4978_t.jpg" />
    </div>
 
    <!-- 5-10 -->
    <div>
      <img src="http://farm1.static.flickr.com/163/399223609_db47d35b7c_t.jpg" />
      <img src="http://farm1.static.flickr.com/135/321464104_c010dbf34c_t.jpg" />
      <img src="http://farm1.static.flickr.com/40/117346184_9760f3aabc_t.jpg" />
      <img src="http://farm1.static.flickr.com/153/399232237_6928a527c1_t.jpg" />
    </div>
 
    <!-- 10-15 -->
    <div>
      <img src="http://farm4.static.flickr.com/3629/3323896446_3b87a8bf75_t.jpg" />
      <img src="http://farm4.static.flickr.com/3023/3323897466_e61624f6de_t.jpg" />
      <img src="http://farm4.static.flickr.com/3650/3323058611_d35c894fab_t.jpg" />
      <img src="http://farm4.static.flickr.com/3635/3323893254_3183671257_t.jpg" />
    </div>
 
  </div>
 
</div>
 
<!-- "next page" action -->
<a class="next browse right"></a>
</div>

CSS

/*
    root element for the scrollable.  when scrolling occurs this
    element stays still.
    */
    .scrollable {
      /* required settings */
      position:relative;
      overflow:hidden;
      width: 660px;
      height:90px;
    }
    /*
    root element for scrollable items. Must be absolutely positioned
    and it should have a extremely large width to accommodate scrollable
    items.  it's enough that you set width and height for the root element
    and not for this element.
    */
    .scrollable .items {
      /* this cannot be too large */
      width:20000em;
      position:absolute;
    }
    /*
    a single item. must be floated in horizontal scrolling.  typically,
    this element is the one that *you* will style the most.
    */
    .items div {
      float:left;
    }

JavaScript

$(function() {
    // initialize scrollable
    $("div.scrollable").scrollable({
        size: 1
    });
});