My tab panels aren't hidden.
There are not javascript conflicts observed in the browser on click or load, and the "ui-tabs-hide" class is never added.
Also the click event just sends the scroll to the top of the page.

The jQueryUI and module JS files are both loaded...
/sites/all/modules/contrib/jquery_ui/jquery.ui/ui/minified/ui.tabs.min.js
/sites/all/modules/contrib/tabs/tabs.js

CommentFileSizeAuthor
#2 tabs_weird_char.gif18.43 KBdoublejosh
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

doublejosh’s picture

BTW: Began using Tabs as a dependency for CCK Fieldgroup Tabs, but embedded tabs_render($form) via PHP Filter in dev to test.
Tried switching back to a base theme too.
The "tabs-processed" class is on the surrounding div.
Cannot isolate the problem!

doublejosh’s picture

FileSize
18.43 KB

Only irregularity I can find is the "left single angle quote" character in tabs.js in Chrome. Also tested in Firefox: not working but character appears fine in the view source. Probably should be used as ‹ I'm guessing. But this may not have anything to do with the problem.

Angle Character

doublejosh’s picture

Tried on a fresh install and found no problems with Tabs, jQueryUI, Libraries and jQueryUI Theme.
Obviously on my setup. Still having a tough time debugging this one.

doublejosh’s picture

Working HTML

<div id="tabs-tabset" class="drupal-tabs js-hide tabs-processed" style="display: block;">
    <div class="description"></div>
    <ul class="clear-block ui-tabs-nav tabs primary">
        <li class="tabset-tab-1 first"><a href="#tabset-tab-1"><span class="tab">One</span></a></li>
        <li class="tabset-tab-2 ui-tabs-selected"><a href="#tabset-tab-2"><span class="tab">Two</span></a></li>
        <li class="tabset-tab-3 last"><a href="#tabset-tab-3"><span class="tab">Three</span></a></li>
    </ul>
    <div id="tabset-tab-1" class="tabs-tabset ui-tabs-panel ui-tabs-hide">
        <h2 class="drupal-tabs-title js-hide">One</h2>First tab content.
    </div>
    <div id="tabset-tab-2" class="tabs-tabset ui-tabs-panel">
        <h2 class="drupal-tabs-title js-hide">Two</h2>Second tab content.
    </div>
    <div id="tabset-tab-3" class="tabs-tabset ui-tabs-panel ui-tabs-hide">
        <h2 class="drupal-tabs-title js-hide">Three</h2>Third tab content.
    </div>
</div>

My HTML

<div id="tabs-tabset" class="drupal-tabs js-hide tabs-processed" style="display: block;">
    <div class="description"></div>
    <ul class="clear-block ui-tabs ui-widget ui-widget-content ui-corner-all tabs primary">
        <li class="one first"><a href="#one"><span class="tab">One</span></a></li>
        <li class="two"><a href="#two"><span class="tab">Two</span></a></li>
        <li class="three last"><a href="#three"><span class="tab">Three</span></a></li>
    </ul>
    <div id="one" class="tabs-tabset">
        <h2 class="drupal-tabs-title js-hide">One</h2>First tab content.
    </div>
    <div id="two" class="tabs-tabset">
        <h2 class="drupal-tabs-title js-hide">Two</h2>Second tab content.
    </div>
    <div id="three" class="tabs-tabset">
        <h2 class="drupal-tabs-title js-hide">Three</h2>Third tab content.
    </div>
</div>

Apparently these classes (ui-tabs-panel, ui-tabs-nav) are failing to get attached from tabs.js

doublejosh’s picture

All of: "tabs-processed", "first" and "last" do get added so at least tabs.js is recognizing the elements.
It's ui.tabs.js that's missing the attachment.

doublejosh’s picture

Seems that jquery_ui_add(array('ui.tabs')); fails while manually loading drupal_add_js($path .'/ui.tabs.js'); does make the tabs work. Perhaps I have the wrong version of jQueryUI?

The tabs/ui.tables.js file is v1.6 while jquery_ui/ui/ui.tabs.js is v1.7.3 which seems a likely cause.

Rolled back to a previous version and doing fine.

doublejosh’s picture

Status: Active » Closed (fixed)