s_ainley87 Posted August 19, 2010 Share Posted August 19, 2010 Hello there, I am working on a project at the moment that requires some seriously skinned up select menus, I have managed to re-skin them but using this plugin however I have no way of determining what item has been selected from what select box as the plugin builds the same HTML every time it meets a select element in my HTML. I need some way of adding a unique identifier onto the end of a class, by manipulating the below plugin. $.fn.customSelect = function() { // define defaults and override with options, if available // by extending the default settings, we don't modify the argument return this.each(function() { obj = $(this); obj.after("<div class=\"selectoptions\"> </div>"); obj.find('option').each(function(){ $(".selectoptions").append("<div id=\"" + $(this).attr("value") + "\" class=\"selectitems\"><span>" + $(this).html() + "</span></div>"); }); obj.before("<input type=\"hidden\" value =\"\" name=\"" + this.name + "\" class=\"customselect\"/><div class=\"iconselect\">" + this.title + "</div><div class=\"iconselectholder\"> </div>") .remove(); $('.iconselectholder').hide(); $(".iconselect").click(function(){ $(".iconselectholder").toggle("slow");}); $(".iconselectholder").append( $(".selectoptions")[0] ); $(".selectitems").mouseover(function(){ $(this).addClass("hoverclass"); }); $(".selectitems").mouseout(function(){ $(this).removeClass("hoverclass"); }); $(".selectitems").click(function(){ $(".selectedclass").removeClass("selectedclass"); $(this).addClass("selectedclass"); var thisselection = $(this).html(); $(".customselect").val(this.id); $(".iconselect").html(thisselection); $(".iconselectholder").toggle("slow") }); }); // do the rest of the plugin, using url and settings } Link to comment https://forums.phpfreaks.com/topic/211154-jquery-plugin-help/ Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.