(function($) {
  $.fn.dropDown = function(options) {
    options = jQuery.extend({ width: 'auto', header: '', callback: function() {}, callback_return: false}, options);
    return this.each(function() {
      var select = $(this);
      var parent = $(this).parent();
      var timeout;
      select.hide();
      // process options
      var items = '<div class="dropDownHeader">'+options['header']+'</div><ul>';
      items += select.find('option').map(function() {
        if ($(this).val() == select.val() && options['callback_return'])
          options['callback']($(this));
        return '<li val="'+$(this).val()+'"><span class="bullet">&bull;</span>'+$(this).html()+'</li>';
      }).get().join('');
      items += '</ul><div class="dropDownBottom"><div class="dropDownBottomLeft"></div><div class="dropDownBottomRight"></div><div class="dropDownBottomPattern"></div></div>';
      // add div wrapper
      select.before('<div class="dropDownList">'+items+'</div>');
      var div = select.prev();
      // calculate width
      var width = (options['width'] != 'auto') ? options['width'] : div.width();
      div.css({width: width+'px'});
      // events
      parent.hover(function() {
        clearTimeout(timeout);
        div.slideDown(300);
      },function() {
        timeout = setTimeout(function() { div.slideUp(300); },300);
      });
      // callback
      div.find('li').bind('click', function() {
        var selected = $(this).attr('val');
        select.find('option').each(function() {
          $(this).removeAttr('selected');
          if ($(this).val() == selected)
            $(this).attr('selected','selected');
        });
        div.remove();
        select.dropDown({width: options['width'], header: options['header'], callback: options['callback'], callback_return: true});
      });

    })
  }

})(jQuery);