samsono / Easy-Responsive-Tabs-to-Accordion

Easy responsive tabs - is a lightweight jQuery plugin which optimizes normal horizontal or vertical tabs to accordion on multi devices like: web, tablets, Mobile (IPad & IPhone). This plugin adapts the screen size and changes its action accordingly.
Other
603 stars 259 forks source link

Close all tabs on load #3

Closed redneckrobot closed 11 years ago

redneckrobot commented 11 years ago

Hi! Great job on the plugin. Question: How would you recommend updating the script to have all tabs closed on page load? Thanks for any insight.

redneckrobot commented 11 years ago

Figured out how to keep all tabs closed on page load. This is for anyone else who is interested.

In the js file, simply comment out:

//First active tab
$respTabs.find('.resp-tab-item').first().addClass('resp-tab-active'); $respTabs.find('.resp-accordion').first().addClass('resp-tab-active'); $respTabs.find('.resp-tab-content').first().addClass('resp-tab-content-active').attr('style', 'display:block');

izziebee commented 11 years ago

How would you go about keeping all tabs closed on page load ONLY on accordion (mobile) view?

Thanks for any help.

StanMel commented 11 years ago

I would like an answer on that as well if possible, this would make the plugin even more complete!

jellekralt commented 11 years ago

Hi guys, i've added the functionality to start closed on accordion, tabs, and both views. I'll make a pull request for Samson but in the meantime you can check out my fork at https://github.com/jellekralt/Easy-Responsive-Tabs-to-Accordion

sandeepsisodia14 commented 8 years ago

Replace this script in our page to close all the tabs-

$(document).ready(function () { $('#horizontalTab').easyResponsiveTabs({ type: 'default', //Types: default, vertical, accordion
width: 'auto', //auto or any width like 600px fit: true, // 100% fit in a container closed: 'accordion', // Start closed if in accordion view activate: function(event) { // Callback function if tab is switched var $tab = $(this); var $info = $('#tabInfo'); var $name = $('span', $info); $name.text($tab.text()); $info.show(); } }); $('#verticalTab').easyResponsiveTabs({ type: 'vertical', width: 'auto', fit: true }); $('.resp-tab-content-active').css('display','none'); });