$(document).ready(function () {
  var $panels = $('#thumb .scrollContainer').find('.video');
  var $container = $('#thumb .scrollContainer');

  $panels.css({
      'float' : 'left',
      'position' : 'relative' // IE fix to ensure overflow is hidden
    });
  // calculate a new width for the container (so it holds all panels)

  $container.css('width', $panels.length * 119);

  // collect the scroll object, at the same time apply the hidden overflow
  // to remove the default scrollbars that will appear
  var $scroll = $('#thumb .scroll').css('overflow', 'hidden');
  // apply our left + right buttons
  $scroll.before('<img class="scrollButtons left" src="/gallery/images/scroll_left.png" />').after('<img class="scrollButtons right" src="/gallery/images/scroll_right.png" />');
  $('img.scrollButtons.left').click(moveLeft);
  $('img.scrollButtons.right').click(moveRight);
});
function moveLeft() {
  $('div.scroll').scrollTo('-=50px', 300, {axis: 'x'});
}
function moveRight() {
  $('div.scroll').scrollTo('+=50px', 300, {axis: 'x'});
}