Toggle Panel is a light-weight jQuery plugin that helps you create toggleable content material.
In search of an accordion as an alternative? Try Accordion A or Tabs + Accordion.
Toggle Panel suits proper right into a responsive or fluid design. Fastened width is feasible too.
Expanded textual content choice
Specify an expanded textual content (e.g. “Learn extra” when collapsed and “Learn much less” when expanded) both through a knowledge attribute or as a jQuery choice.
As soon as the toggle panel ingredient is concentrated, you should use the house key to toggle it.
With HTML5 Native Storage the state (expanded or collapsed) is saved and restored upon reentering the web page. Or you’ll be able to select for Session Storage, which remembers the state throughout a single searching session.
Hash hyperlink to any toggle panel or its content material.
With the Pause Media choice, HTML5 audio and video components inside a toggle panel are mechanically paused when it’s collapsed.
Although Toggle Panel is made so simple as doable, it has prolonged documentation that can assist you out.
Clean and exquisite CSS3 transitions deliver Toggle Panel to life.
Prefer to hangout with LESS? There you go, the LESS stylesheets are included within the obtain bundle.
Two themes are included, Minimal and Boxed.
Additionaly, there may be an empty CSS and LESS theme which you should use to kickstart your personal.
Load content material through AJAX
- Content material is loaded as soon as
- Panel expands when content material is prepared
- Choice to specify a selector
- Minimal theme has a loading icon (which may be modified through CSS) that’s Retina prepared
- Customized error messages
- Appropriate with jQuery Ajax Retry
A number of and nested cases
You possibly can create a number of cases on the identical web page and you’ll embed toggle panels a number of ranges.
Highly effective API
Increasing, collapsing and toggling content material may be executed by way of the API.
Go to the API documentation for a whole overview of obtainable strategies, choices and occasions.
- Compatibility desk