Height of sidebar

There are two generally accepted ways of doing 100% height sidebars, 1) fake it with a tiling image, or 2) use an equal height JavaScript, there are many around but you will need one that can accept two classes, I have used this script a lot over the years, just be aware it does not react if the height of one of the columns changes, such as opening a collapsed block or fieldset etc:

You can use this exactly as is and it will work:

/**
 * This will set sidebars and the main content column all to equal height:
 *  if (Drupal.jsEnabled) {
 *    $(document).ready(function() {
 *    $('#content-column, .sidebar').equalHeight();
 *   });
 *  }
 *  
 * This will set all blocks in regions (not sidebars) to equal height:
 *  if (Drupal.jsEnabled) {
 *    $(document).ready(function() {
 *    $('#region-name .block-inner').equalHeight();
 *   });
 *  }
 */
jQuery.fn.equalHeight = function () {
  var height = 0;
  var maxHeight = 0;

  // Store the tallest element's height
  this.each(function () {
    height = jQuery(this).outerHeight();
    maxHeight = (height > maxHeight) ? height : maxHeight;
  });

  // Set element's min-height to tallest element's height
  return this.each(function () {
    var t = jQuery(this);
    var minHeight = maxHeight - (t.outerHeight() - t.height());
    var property = jQuery.browser.msie && jQuery.browser.version < 7 ? 'height' : 'min-height';
    
    t.css(property, minHeight + 'px');
 });
};

And call it with:

$(document).ready(function() {
  $('#content-column, .sidebar').equalHeight();
});

Works for me. Would be great, if I could just turn it on in theme setting like in Omega (sub-)theme.

I used to have this as a theme setting, however its such an edge case (very few people want this compared to the amount of people who use the theme), so I removed it, no point in supporting things people hardly ever do.

Its also just a bad idea, believe me, doing equal heights with JavaScript has issues. There are better ways, so a theme setting is just rather silly for this.

would you mind sharing how to implement? which files should these lines be put and where within the files do you include these lines? sorry for the dumb question - i am new to drupal and unclear about how to employ equal heights javascript with my sidebar and content columns...

hello Jeff,
I add this code to header, but it not work. i created a scripts.js with this code. so i call this scripts in mytheme.info. when i saw the script on sources of chrome. it mesage error $ in " $(document).ready(function() {
Uncaught TypeError: Property '$' of object [object Window] is not a function
$('#content, #sidebar-second').equalHeight();
}); "
How to fix it,
Thank you very much,