The plugins site is currently in development.
We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.
ExpandCollapse
ExpandCollapse automatically attaches to any jQuery object and binds a click event to that objects "trigger" element (can either be passed in or created automatically) that will expand or collapse the element upon clicking. There are plenty of options to keep usage flexible:
Options
-
updateText: true or false
whether or not to update the trigger element's text on click (uses the values from expandText and collapseText). -
updateClass: true or false
whether or not to update the trigger element's class on click (uses the values from expandClass and collapseClass). -
startHidden: true or false
whether or not to automatically hide any matched elements. This is useful for graceful degrading, in case the user has javaScript turned off and you still want your toggled elements to show up. - triggerTag: "<span/>"
- triggerElement : ""
- expandClass: "expand"
- collapseClass: "collapse"
- textElement: ""
- expandText: "more"
- collapseText: "less"
- expandAnimation: {height : "show"}
- collapseAnimation: {height : "hide"}
- expandDuration: 0
- collapseDuration: 0
Usage
$('.details').expandCollapse({ startHidden : true });
$('body:not(#portfolio) ul.subnav').expandCollapse({
updateText : false,
updateClass : false,
startHidden : true,
triggerElement : $('.trigger'),
expandDuration : "fast",
collapseDuration : "slow"
});
