-
Notifications
You must be signed in to change notification settings - Fork 0
/
params.json
1 lines (1 loc) · 2.36 KB
/
params.json
1
{"name":"Bootstrap-responsive-tabs","tagline":"","body":"Bootstrap Responsive Tabs\r\n=========================\r\n\r\nThis uses standard Bootstrap 3.0.0 css and js for the tabs and collapse accordion items. They are regular [tabs](http://getbootstrap.com/javascript/#tabs) at some screen sizes and [collapsible](http://getbootstrap.com/javascript/#collapse) components based on the Bootstrap [Responsive Utilities](http://getbootstrap.com/css/#responsive-utilities), which can be defined by editing one attribute in the javascript file.\r\n\r\nDemo\r\n====\r\nTo view the demo visit http://openam.github.io/bootstrap-responsive-tabs/\r\n\r\nKey features\r\n============\r\n- Uses standard bootstrap tab markup.\r\n- Collapsible component (accordion) is created with jquery.\r\n- Tabs and accordions are accessible via keyboard.\r\n- Supports multiple tab groups on a page, with or without each being responsive.\r\n\r\nNotes\r\n=====\r\n- On load the first item in the accordion and tab views are set to active opened. However only the respective set will be show.\r\n- When the window is resized to change from accordion to tabs, the last tab that was opened will be opened even if a different accordion was selected.\r\n- Only tried in Chrome and Firefox, but it should work in IE as well.\r\n\r\nHow to use\r\n==========\r\n- Include bootstrap css and js.\r\n- Include responsive-tabs.js.\r\n- Setup tabs per the bootstrap documents.\r\n- Add a _responsive_ class to the _ul_ that is used to create the tabs.\r\n- Add a _responsive_ class to the _div_ that is used to create the tab-content.\r\n- Edit the responsive-tabs.js to set where you want to have collapse in place of tabs\r\n\r\n>__Note:__ The only difference from the standard bootstrap tab markup to the responsive markup is the addition of the responsive.\r\n\r\n```\r\n<ul class=\"nav nav-tabs responsive\" id=\"myTab\">\r\n <li class=\"active\"><a href=\"#home\">Home</a></li>\r\n <li><a href=\"#profile\">Profile</a></li>\r\n <li><a href=\"#messages\">Messages</a></li>\r\n</ul>\r\n\r\n<div class=\"tab-content responsive\">\r\n <div class=\"tab-pane active\" id=\"home\">...content...</div>\r\n <div class=\"tab-pane\" id=\"profile\">...content...</div>\r\n <div class=\"tab-pane\" id=\"messages\">...content...</div>\r\n</div>\r\n```\r\n","google":"","note":"Don't delete this file! It's used internally to help with page regeneration."}