[jQuery] Re: tabs collapsed by default on open
THANK YOU SO SO MUCH! On Apr 16, 7:29 pm, Klaus Hartl klaus.ha...@googlemail.com wrote: On 16 Apr., 20:38, robintrain...@yahoo.com robintrain...@yahoo.com wrote: Hello everyone. Is there a way to have tabs created in jQuery that are collapsed when the page loads? I use this: $(document).ready(function(){ $(#tabs).tabs({ collapsible: true }); }); to allow the user to click on the tab to collapse it once the page loads. But how do I get the tab content to be hidden to begin with? Use: $(document).ready(function(){ $(#tabs).tabs({ collapsible: true, selected: -1 }); }); You don't necessarily have to use collapsible in this case by the way. --Klaus
[jQuery] tabs collapsed by default on open
Hello everyone. Is there a way to have tabs created in jQuery that are collapsed when the page loads? I use this: $(document).ready(function(){ $(#tabs).tabs({ collapsible: true }); }); to allow the user to click on the tab to collapse it once the page loads. But how do I get the tab content to be hidden to begin with? Thanks very much, Robin HTML for TABS div id=tabs ul lia href=#fragment-1spanOne/span/a/li lia href=#fragment-2spanTwo/span/a/li /ul br div id=fragment-1 Content for tab 1 /div div id=fragment-2 Content for tab 2 /div /div CSS for TABS style type=text/css .ui-tabs { padding: .2em; zoom: 1; } .ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: .2em .2em 0; } .ui-tabs .ui-tabs-nav li { float: left; border-bottom-width: 1 ! important; margin: 0 .2em -1px 0; padding: 0; } .ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: .5em 1em; } .ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 1; background-color:#ff; } .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; } .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ .ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border- width: 1; background-color: #cc; float:left; width: 500px; } .ui-tabs .ui-tabs-hide { display: none !important; } /style