Cacher is the code snippet organizer for pro developers

<div>
  <button class="scroll-btn scroll-to-left" type="button">&larr;</button>
  <p>Suspendisse faucibus, nunc et pellentesque egestas, lacus ante convallis tellus, vitae iaculis lacus elit id tortor. Etiam vitae tortor. Vivamus laoreet. Cras dapibus. Nam pretium turpis et arcu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut tincidunt tincidunt erat. Donec venenatis vulputate lorem. Vestibulum facilisis, purus nec pulvinar iaculis, ligula mi congue nunc, vitae euismod ligula urna in dolor. Phasellus gravida semper nisi. Morbi vestibulum volutpat enim. Curabitur a felis in nunc fringilla tristique. Phasellus accumsan cursus velit. Praesent venenatis metus at tortor pulvinar varius. Fusce risus nisl, viverra et, tempor et, pretium in, sapien. Sed in libero ut nibh placerat accumsan. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. In hac habitasse platea dictumst. Curabitur a felis in nunc fringilla tristique. Curabitur suscipit suscipit tellus. Donec mollis hendrerit risus. Sed lectus. Sed fringilla mauris sit amet nibh. Praesent ac massa at ligula laoreet iaculis.</p>
  <button class="scroll-btn scroll-to-right" type="button">&rarr;</button>
</div>

$(function() {
  'use strict';
  
  var scrollingValue = 30;
  var scrollbarPosition = 10;
  
  function getMaxChildWidth( elm ) {
    var childrenWidth = $.map($('>*', elm), function(el) { return $(el).width() });
    var max = 0;
    for (var i = 0; i < childrenWidth.length; i++) {
      max = childrenWidth[i] > max ? childrenWidth[i] : max;
    }
    return max;
  }
  
  function getScrollingValue(toLeft, ctx) {
    
    if (toLeft) {
      return scrollbarPosition < 1 ? 0 : scrollingValue;
    }
    return scrollbarPosition >= getMaxChildWidth(ctx) ? 0 : scrollingValue;
  }
  
  $('.scroll-btn.scroll-to-left').on('click', function() {
    $(this).parent().scrollLeft(
      scrollbarPosition -= getScrollingValue(true, $(this).parent())
    );
  });
  
  $('.scroll-btn.scroll-to-right').on('click', function() {
    $(this).parent().scrollLeft(
      scrollbarPosition += getScrollingValue(false, $(this).parent())
    );
  });
});

var button = document.getElementById('scroll-right');
button.onclick = function () {
    var container = document.getElementById('container-item-scroll');
    sideScroll(container,'right',25,100,10);
};

var back = document.getElementById('scroll-left');
back.onclick = function () {
    var container = document.getElementById('container-item-scroll');
    sideScroll(container,'left',25,100,10);
};

function sideScroll(element,direction,speed,distance,step){
    scrollAmount = 0;
    var slideTimer = setInterval(function(){
        if(direction == 'left'){
            element.scrollLeft -= step;
        } else {
            element.scrollLeft += step;
        }
        scrollAmount += step;
        if(scrollAmount >= distance){
            window.clearInterval(slideTimer);
        }
    }, speed);
}

jQuery(document).ready(function ($) {

    $('#navbar-2 a').on('click',function() {
        $('.navbar-collapse').collapse('hide');
    });
});