jQuery Based Responsive Tabbed Panels Plugin - Yeotabs
File Size: | 36.6 KB |
---|---|
Views Total: | 1569 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Yeotabs is a simple jQuery plugin that creates responsive tabbed panels and turns them into an accordion interface for small screen devices.
How to use it:
1. Include the jQuery javascript library and jQuery Yeotabs plugin's javascript and CSS in the page.
<link rel="stylesheet" href="yeoTabs.css" media="screen"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="jquery.yeoTabs.js"></script>
2. Create tabs for content within a specified container.
<div class="demo"> <div class="panels"> <div> <label>Tab1</label> <h2>Tab panel 1</h2> <p>This is the first panel</p> </div> <div> <label>Tab2</label> <h2>Tab panel 2 </h2> <p>This is the second panel</p> </div> <div> <label>Tab3</label> <h2>Tab panel 3 </h2> <p>This is the third panel</p> </div> </div> </div>
3. Call the plugin on the tabs container.
<script> $('.demo').yeoTabs(); </script>
This awesome jQuery plugin is developed by nlemke847. For more Advanced Usages, please check the demo page or visit the official website.