ZoomTabs and Accordions.

Fully Responsive
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
Slider Support
Easy Setup
  1. copy the dzszoomtabsandaccordions/dzszoomtabsandaccordions.js and dzszoomtabsandaccordions/dzszoomtabsandaccordions.css to your project folder
  2. in your .html write the markup given by the docs file
  3. all ready for your new tabs
Fully Responsive
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
Sliders Work
  • captions supported
Easy Setup
  1. copy the dzszoomtabsandaccordions/dzszoomtabsandaccordions.js and dzszoomtabsandaccordions/dzszoomtabsandaccordions.css to your project folder
  2. in your .html write the markup given by the docs file
  3. all ready for your new tabs

The only tabs and toggles plugin you need.

Icon Support.

Image Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error.

Read More Action

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio.
Tabs in Tabs
Image Support
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.
Tabs in Tabs
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
Map Support
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
Map Support

Full FontAwesome support is included. Attach any icons to tab titles or content.

This example is set to skin-box and has some FontAwesome icons attachded to the tab titles. The tabs width is set to fullwidth so that the tab titles cover the full width. Also the tabs have an integrated API, just try it.

Go to tab 2

Any Tabs can be Accordions.

... and will be automatically when the responsive switch is achieved. The responsive switch can be anything from 200px to 20000px. Anything below the responsive switch will be a toggle. So if you want the tabs to always display as toggles / accordions, you should set to a high number like that. In the example on the right, you should see how easy it is to display an image accordion. The skin is skin-blue and the type is set to accordion.

NEW: You have the option to pick the highlight color in the admin, test it now for the tabs on the right

Image 01
Image 02
Image 03
Fully Responsive
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Multiple Skins
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
Easy Setup
Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?

Works on Black Themes.

This example has set skin-melbourne and tabs are on the left side. The transitions is set to slide. The background is set to black to show that ZoomTabs and Accordions looks fine in any enviroment.

Also, this example has enabled linking which means that any tab you click will be saved in the link for sharing or for remembering which tab you opened and remain opened.

FAQ Style.

This example is set to always be a toggle. It is build like a Frequently Asked Questions to show the capability of the plugin. The skin is skin-box and the transition is set to fade.

The accordion mode is set to toggle. An accordion leaves the other items closed while showing only the active one. A toggle lets the past items be open.

What is ZoomTabs and Accordions ?
ZoomTabs and Accordions is a Tabs and Toggles plugin that you can use to display content like products, tabbed content, faq's, etc.
Why two in one?
Because the similar structure, we decided to unite these 2 types of plugins into 1. Also, toggles make a fine backup for tabs on mobile devices.
Toggles or Accordions ?
Well the only difference between Toggles and Accordions is that when a Accordion item is clicked, the other items are closed. When a Toggle is clicked, the other items can remain opened.

Responsive

Mobile ready! Retina ready! Tested on iOS and Android 4.0+. Responsive from mobile to HD due to CSS 3 Media Queries. Retina ready due to use of font icons and no images. Scales to any dimension!

Easy Install

Install DZS ZoomTabs in just a couple of minutes. Docs are also there.

Responsive

From mobile to HD, DZS ZoomTabs are ultra responsive. Also has retina graphics.

Customizable

Customize DZS ZoomTabs with the many options included.

SEO Friendly

Built with SEO in mind, DZS ZoomTabs parses html content into working magic.