(function($) {
  $.fn.scrollable = function(options) {
    var settings = {
      'height' : ($(window).height()*0.8)+'px'
    };
    
    if (options) { 
      $.extend(settings, options);
    }
    
    this.each(function () {
      if ($(this).data('isScrollWrapped') !== true) {
        /** TODO: The clear property should be identified intelligently.  
         *  It may not always be appropriate to clear the content. */
        $(this).wrap('<div class="_scrollWrap" style="clear:both;" />');
      }
      var scrollWrap = $(this).parent('._scrollWrap');
      $(this).data('isScrollWrapped', true);
      if (scrollWrap.length) {
        scrollWrap.css('overflow', 'auto');
        if (scrollWrap.attr('scrollWidth') > scrollWrap.width()) {
          scrollWrap.css('max-height', settings.height);
          scrollWrap.css('position', 'relative');
        } else {
          scrollWrap.css('overflow', 'visible');
          scrollWrap.css('overflow-x', 'visible');
          scrollWrap.css('overflow-y', 'visible');
          scrollWrap.css('max-height', 'none');
          scrollWrap.css('height', 'auto');
          scrollWrap.css('position', 'static');
        }
      }
    });
  };
}) (jQuery);