Contractible Headers Menu, Plus and Minus Signs

[cesiel1993]

1) Script Title: Contractible Headers

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/navigate2.htm

3) Describe problem: I'm wondering if it's possible to have the plus signs turn to minus signs once they are clicked on and expanded.

I have my content and titles (two images for titles - one with plus and one with minus) as two different div classes.

Title CSS:

.rb_title {
	 	background-image: url(../images/rb_title-plus.png); (or rb_title-minus.png for a minus sign)
	 	width: 190px;
	 	height: 23px;
	 	padding: 7px 0px 0px 10px;
	 	margin-top:7px;
	 	margin-bottom:3px;
	 	font: 14px Arial, Sans-Serif;
	 	font-weight: bolder;
	 	color: #FFFFFF;
	 	cursor:pointer;
}

Content CSS:

.rb_content {
	width: 190px;
	margin: 0 auto;
}

Thanks!

[ddadmin]

Short answer, use Switch Content script instead. "Contractible Headers" script is actually based on an older version of mentioned script, but the new one contains numerous new features, including what you're asking.

[cesiel1993]

Is there a way to use both jquery and mootools together? SmoothGallery requires it and I'd like to use that along side with this menu.

[stevenng]

You can use the jQuery JS library and this snippet on a DL (definition list):

$("dt a").toggle(
function(){
$(this).parent().next().slideDown();
$(this).find("img").attr("src","/icon/dashminus_sm.gif");
},
function(){
$(this).parent().next().slideUp();
$(this).find("img").attr("src","/icon/dashplus_sm.gif");
}
);