$.fn.customSelect = function(settings){
  var _default = $.extend({
	beforeChange : function (){},
    onChange : function (){}
  }, settings);
  return this.each(function(){
    
    var $this = $(this);
    var $pointer = $('<div/>').addClass('select-pointer');
    var $text = $('<div/>').addClass('select-text');
    var $select = $('<div/>').attr('id', 'select-' + $this.attr('id')).addClass('select').addClass('radius-4').insertAfter($this).mousedown(function(){
      if(_default.beforeChange!=null && $.isFunction(_default.beforeChange))
      {
        _default.beforeChange.apply($this);
      }
      var _offset = $(this).offset();
      if($list.is(':visible'))
          $list.hide();
      else
        $list.css({
          left:_offset.left, 
          top:_offset.top+$select.outerHeight()
        }).show();
        return false;
    }).append($pointer).append($text);

    var $list = $('<ul/>').attr('id', 'custom-' + $this.attr('id')).addClass('select-options').addClass('radius-4').hide().appendTo('body');
    
    $this
      .hide()
      .children()
        .each(function(){
          
          var $option = $('<li/>').text( $(this).text() ).data('opt-value', $(this).val()).mousedown(function(){
            
            if($this.val() == $(this).data('opt-value'))
              return;
            
            $list.find('.select-options-selected').removeClass('select-options-selected').end().hide();
            $(this).addClass('select-options-selected');
            $text.text($(this).text());
            $this.val($(this).data('opt-value'));
            
            if(_default.onChange!=null && $.isFunction(_default.onChange))
            {
              _default.onChange.apply($this);
            }
                            
            return false;
          });
          
          if($(this).attr('selected')){
            $text.text($(this).text());
            $option.addClass('select-options-selected');
          };
          
          $list.append($option);
        });
    

        
    if($list.innerWidth() < $select.innerWidth())
      $list.width($select.innerWidth());
    
    //
    var inSelect = false;
    $list.hover(
    function(){
    	inSelect = true;
    },
    function(){
    	inSelect = false;
    });
    
    $(document).mousedown(function(){
        if(!inSelect)
        	$list.hide();
      });
  });
}