outer/inner/Width/Height

dimensions.js

  ['width', 'height'].forEach(function(dimension) {
    var offset, Dimension = dimension.replace(/./, function(m) { return m[0].toUpperCase() });
    $.fn['outer' + Dimension] = function(margin) {
      var elem = this;
      if (elem) {
        var size = elem[dimension]();
        var sides = {'width': ['left', 'right'], 'height': ['top', 'bottom']};
        sides[dimension].forEach(function(side) {
          size += parseInt(elem.css('padding-' + side), 10);
          size += parseInt(elem.css('border-' + side + '-width'), 10);
          if (margin) size += parseInt(elem.css('margin-' + side), 10);
        });
        return size;
      } else {
        return null;
      }
    };
    $.fn['inner' + Dimension] = function() {
      var elem = this;
      if (elem) {
        var size = elem[dimension]();
        var sides = {'width': ['left', 'right'], 'height': ['top', 'bottom']};
        sides[dimension].forEach(function(side) {
          size += parseInt(elem.css('padding-' + side), 10);
        });
        return size;
      } else {
        return null;
      }
    };
  });