Edit Question - KnowledgeHub

Title Body

I'm trying to modify the icons for the jQuery UI portlets . Rather than have a plus to minimize and a minus to expand, I wanted to switch them. I've only had limited success with it where the first time to click the minus it flips to a plus, but the plus never flips to a minus. Any help on this would be much appreciated. Here's a sample HTML: <script src="scripts/jquery-1.3.2.js" type="text/javascript" ></script> <script src="scripts/ui/ui.core.js" type="text/javascript"></script> <script src="scripts/ui/ui.sortable.js" type="text/javascript"></script> <div class="column"> <div class="portlet"> <div class="portlet-header">Links</div> <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div> </div> </div> Here's what I came up with for the jQuery: <script type="text/javascript"> $(function() { $(".column").sortable({ connectWith: '.column' }); $(".portlet").addClass("ui-widget ui-widget-content ui-helper-clearfix ui-corner-all") .find(".portlet-header") .addClass("ui-widget-header ui-corner-all") .prepend('<span class="ui-icon ui-icon-minusthick"></span>') .prepend('<span class="ui-icon ui-icon-closethick"></span>') .end() .find(".portlet-content"); $(".portlet-header .ui-icon-minusthick").click(function() { $(this).removeClass("ui-icon-minusthick"); $(this).addClass("ui-icon-plusthick"); $(this).parents(".portlet:first").find(".portlet-content").toggle(); }); $(".portlet-header .ui-icon-plusthick").click(function() { $(this).removeClass("ui-icon-plusthick"); $(thi

Tags (comma-separated) Cancel