CP Blogs

Expand and Contract

Hello, here is a light weight way to Expand and Contract div's, span's, or what have you...

Javascript - jQuery

 $(".extendHANDLE").click(function(){ if($(this).next().hasClass("Nextend")){ $(this).find("span").text("[-]"); $(this).next().slideDown("fast"); $(this).next().removeClass("Nextend"); $(this).next().addClass("extend"); }else{ $(this).next().slideUp("fast"); $(this).find("span").text("[+]"); $(this).next().addClass("Nextend"); $(this).next().removeClass("extend"); } }); 

HTML

 
Get Social With It
[+]
 
 what have you. 
 

CSS

 .Nextend{ display:none;} 

Note: To have one start open just just .extend inplace of .Nextend

Simple, but it still needs jQuery.

The demo is all over... just look for [+] ;)