Autosize the Foundation 4 section tab titles

autosize-f4.js

// Make sure that other JS has finished it's stuff
$(window).load(function() {
  // Existence check for elements as well as whether we are in mobile or not
  if($('.MY-CSS-SELECTOR .section-container .section p.title').length > 0 && $(window).width() > 480) {
    // Simple math to determine the percentage width of each title
    var c = $('.MY-CSS-SELECTOR .section-container .section p.title').length;
    var w = Math.floor(100 / c);
    // Iterate over DOM elements and get the index so we can set an offset
    $('.MY-CSS-SELECTOR .section-container .section p.title').each(function() {
      // The left position will be the index of the element in relation to the tab container TIMES the width
      // index() is 0 based so that is helpful because our first element needs an offset of 0
      var o = w * $(this).parents('.section').index();
      // Thanks foundation for using absolute position!
      $(this).css({'width' : w + '%', 'left' : o + '%'});
    });
  }
});