[jQuery] Re: tabs collapsed by default on open

2009-04-17 Thread robintrain...@yahoo.com

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

2009-04-16 Thread robintrain...@yahoo.com

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