$(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 420;
  var slides = $('.my_tab');
  var numberOfSlides = slides.length;

  // Remove scrollbar in JS
  $('.my_tab_container').css('overflow', 'hidden');

  // Wrap all .slides with #slideInner div
  /*slides
  .wrapAll('<div id="slideInner"></div>')
  // Float left to display horizontally, readjust .slides width
  .css({
    'float' : 'left',
    'width' : slideWidth
  });

  // Set #slideInner width equal to total width of all slides
  $('#slideInner').css('width', slideWidth * numberOfSlides);
  $('#slideInner').css('border', '1px solid red');

*/
  // Create event listeners for .controls clicks
  $('.tab_link')
    .bind('click', function(){
		no = $(this).attr('no');
		margin = slideWidth*(-no);
      // Move slideInner using margin-left
      $('.my_tabs').animate({
        'marginLeft' : margin
      });
	  
	  $('.tab_link').removeClass('active_tab');
	  $(this).addClass('active_tab');
    });
});