jQuery-Collapse – Expanding & Collapsing Content With JavaScript
In order to save space and display the content only when requested, expanding/collapsing panels are used widely.
Using jQuery, such a functionality is very easy to implement with methods like toggle, show, hide and several others.
jQuery-Collapse is an ultra-lightweight (<1kb minified) plugin built specifically for this case with added features.
It allows us to define the HTML elements to be hidden and displayed when needed with a simple function that has callbacks for integrating custom events.
There is also cookie support which remembers the state of the content panels and displays them accordingly when the page is re-visited.
The plugin is also designed with WAI-ARIA in mind that helps the web pages being more accessible to people with disabilities.
And, it is also cross-browser, completely tested in major browsers (including IE6).
Compatibility: All Major Browsers
Website: http://webcloud.se/code/jQuery-Collapse/
Download: http://github.com/danielstocks/jQuery-Collapse
- Tags:
Javascript
- Filed under: Browsing, Goodies, MIT License
- 2 Comments
2 Responses for "jQuery-Collapse – Expanding & Collapsing Content With JavaScript"
Thanks for the plug-in. I was looking for this for a project not too long ago but had to resort to a opacity effect instead. :p
Btw, as a suggestion, I think the content bar is too narrow. You might want to venture in responsive web design or something. There is too much bulk on ads and not the content. Content should be king.
@Marco,
Accomplishing a similar functionality with jQuery is so easy but the cookie integration and tiny size makes it worth.
I agree with the content bar size and already planning a responsive design.
“Content should be king”.. definitely.