jquery.dropnice.js

/*
 * jQuery DropNice Plugin
 * http://wingsc.com/makes/dropnice
 *
 * Copyright (c) 2010 Woody Gilk <woody@wingsc.com>
 * http://wingsc.com
 * http://docs.jquery.com/License
 *
 * Date: 2009-02-19 17:34:21 -0500 (Thu, 19 Feb 2009)
 * Requires: jQuery 1.3+
 */
jQuery.fn.dropnice = function(settings){
	settings = jQuery.extend({
		format: function(value, title) { return '<a rel="'+ value +'">'+ title +'</a>'; }
	}, settings);
	return this.each(function(){
		var self = jQuery(this); // Dropdown
		var wrap = jQuery('<div class="dropnice"></div>'); // Wrapper
		var curr = jQuery('<div class="selected"></div>').appendTo(wrap); // Selected option
		var opts = jQuery('<div class="options"></div>').hide().appendTo(wrap); // Options wrapper
		var list = jQuery('<ul></ul>').appendTo(opts); // Options list
		self.find('option').each(function()
		{
			var o = jQuery(this); // Option
			var v = o.val(); // Value of option
			var t = o.text(); // Text of option
			var i = jQuery('<li class="option"></li>').appendTo(list); // List item
			var a = jQuery(settings.format(v, t)).appendTo(i); // Item link
			a.click(function()
			{
				if ( ! curr.hasClass(v))
				{
					self.val(v).change(); // Change selected value
					curr.html(a.clone()); // Update selected class
				}
				return false; // Stop the "click" event
			});
			if (o.attr('selected')) { curr.html(a.clone()); } // Activate selected value
			wrap.hover(function()
			{
				opts.stop(true, true).slideDown();
			},
			function()
			{
				opts.stop(true, true).slideUp();
			});
		});
		wrap.insertAfter(self.hide()); // Replace select
		opts.width(wrap.width()); // Options should match the width of the wrapper
	});
};