What a bizarre interface. Good luck with that. OK, to isolate the problem, first thing I would do is reduce the javascript files you are loading here. By my count you are loading 22 .js files. Are all those necessary on this page? Lord knows what the possible infelicities may exist here!
Remember you're using the very latest jQuery and it may not certifiably work with all these other plugins. You're on the bleeding edge here, man, and you need to be somewhat circumspect loading all these files. Regardless, the jQuery-UI javascript loads ninth (of 22) and I would certainly try loading that first, see if that helps. Secondly, as a matter of style and ease of debugging, I recommend NOT placing a massive function definition in a parameter. Instead, use a reference to a function whose code you can stash elsewhere. That would drastically simplify following this code, not to mention that the function reference will have a name that hopefully abstracts what you're trying to do. **--** Steve On Feb 25, 5:56 pm, pixeline <[email protected]> wrote: > although i managed to create the tabs i needed in an isolated page, > i'm struggling to implement it in my application. > > It really seems the tabs() is not fired because if i look at hte > generated source, the classes added by the plugin aren't there. They > used to in the pre - ui version of the tabs i was using. > > Now, it may be due to jquery1.3.2 because i know it played on a > livequery similar function live() and i'm setting up the tabs() inside > a livequery function. > Can you tell me if this is correct? > > var $this = $("#leftCol"); > var href = UI.APP_URL + UI.sectionFolder + '/' + UI.item + '/' + > UI.menu + '/' + UI.content + '/'; > UI.goLivequery = true; > $this.livequery(function() > { > if (UI.goLivequery === true) > { > UI.goLivequery = false; > $this.load(href, function() > { > $this.removeClass('loading'); > UI.goLivequery = false; > // bunch of other stuffs that all > work correctly > > $('#tabbedTextContent').tabs(); > $('#tabbedTextContent img.albumImage') > .css('cursor', 'pointer') > .click(function() > { // in image albums, clicking on an > image brings the user to the next image > var currentTab = $tabs.data > ('selected.tabs'); > $('#imageLegend').text($(this).attr > ('title')); > var nextTab = (currentTab < > $tabs.length - 1) ? currentTab + 1 : 0; > $tabs.tabs('select', nextTab); > return false; > }); > > }); > } > > }); > > And the markup is: > > <div id="tabbedTextContent"> > <div id="fragment0"><img src="http://localhost/lab-au.com/dev/theory/ > article_sonic-space/images/album_images/ > 00_cover_arca_sonic_space_labau00s.jpg" class="albumImage" > title="00_cover_arca_sonic_space_labau00s.jpg" /></div> > <div id="fragment1"><img src="http://localhost/lab-au.com/dev/theory/ > article_sonic-space/images/album_images/ > 01_arca_sonic_space_labau01_left_s.jpg" class="albumImage" > title="01_arca_sonic_space_labau01_left_s.jpg" /></div> > <div id="fragment2"><img src="http://localhost/lab-au.com/dev/theory/ > article_sonic-space/images/album_images/ > 02_arca_sonic_space_labau02_right_s.jpg" class="albumImage" > title="02_arca_sonic_space_labau02_right_s.jpg" /></div> > <div id="fragment3"><img src="http://localhost/lab-au.com/dev/theory/ > article_sonic-space/images/album_images/ > 03_arca_sonic_space_labau03_left_s.jpg" class="albumImage" > title="03_arca_sonic_space_labau03_left_s.jpg" /></div> > <div id="fragment4"><img src="http://localhost/lab-au.com/dev/theory/ > article_sonic-space/images/album_images/ > 04_arca_sonic_space_labau04_right_s.jpg" class="albumImage" > title="04_arca_sonic_space_labau04_right_s.jpg" /></div> > <div id="fragment5"><img src="http://localhost/lab-au.com/dev/theory/ > article_sonic-space/images/album_images/ > 05_arca_sonic_space_labau05_left_s.jpg" class="albumImage" > title="05_arca_sonic_space_labau05_left_s.jpg" /></div> > <div id="fragment6"><img src="http://localhost/lab-au.com/dev/theory/ > article_sonic-space/images/album_images/ > 06_arca_sonic_space_labau06_right_s.jpg" class="albumImage" > title="06_arca_sonic_space_labau06_right_s > .jpg" /></div> > <ul class="tab-nav-menu"> > <li><a href="#fragment0">0</a></li> > <li><a href="#fragment1">1</a></li> > <li><a href="#fragment2">2</a></li> > <li><a href="#fragment3">3</a></li> > <li><a href="#fragment4">4</a></li> > <li><a href="#fragment5">5</a></li> > <li><a href="#fragment6">6</a></li> > <li id="imageLegend">Arca 180</li> > </ul> > </div> > > if you want to see it for yourself: > > http://m2.lab-au.com > > clickpath to reproduce the error: theory > writings > articles > Any > of the 3 items > Visuals. There, the images should be tabbified. they > are not, and if u check the generated source code; no ui classes have > been injected. > > Thanks in advance for your help _ i'm getting desperate. > > On Feb 25, 10:30 pm, pixeline <[email protected]> wrote: > > > OK, i made a separate implementation, only having the uitabs in the > > codeflow. turns out its the tab nav ul list inside the h3 is a no-go. > > to have the tabs displayed underneath only needs to have your markup > > reflect that: the ul after the tabbed divs. Would have assumed that > > should be set via css, not html but why not. At least it's possible so > > i'm happy. nice one, well done ui team ! > > > if i may ask: would it be possible to be able to locate the tabs > > navigator anywhere in the markup, instead of right before or right > > next to the tab divs ? > > > On Feb 24, 5:15 pm, pixeline <[email protected]> wrote: > > > > Thanks for the feedback i was in fact already using rc6 (that's a typo > > > of mine on my first post, sorry). Can you explain me how should my > > > markup/css be so that the tabs can be displayed underneath the tabs ? > > > > On Feb 24, 5:07 am, Steven Black <[email protected]> wrote: > > > > > First thing I would do, Alexandre, is get yourself jquery UI 1.6.rc6, > > > > an upgrade from rc5. > > > > > You might also venture to the latest version of Tabs in the svn trunk. > > > > http://jquery-ui.googlecode.com/svn/trunk/ui/ > > > > > It's unusual that your <ul>...</ul> isn't first in your > > > > #tabbedTextContent, which is probably OK in theory but might be a > > > > problem in practice. > > > > > Also your <ul>...</ul> is nested in an <h3> and that's asking for > > > > trouble too since your #fragments aren't siblings of <ul>. Mine are > > > > siblings, and my tabs work, but I'm guessing. > > > > > That said, I had all sorts of problems with rc5 that disappeared with > > > > rc6. Make sure you've got the latest CSS files too. > > > > > **--** Steve > > > > > On Feb 23, 5:40 am, pixeline <[email protected]> wrote: > > > > > > Hello! > > > > > > I'm upgrading ui tabs from the old standalone 2007 version to the > > > > > jquery ui implementation so bear with me :) > > > > > > jquery 1.3.2.min > > > > > jquery UI 1.6.rc5 personalized (only core + tabs) > > > > > > The markup generated and to be tabbified: > > > > > > <div id="tabbedTextContent"> > > > > > <div id="fragment0"> > > > > > <img src="http://localhost/lab-au.com/dev/theory/ > > > > > article_sonic-space/images/album_images/ > > > > > 00_cover_arca_sonic_space_labau00s.jpg" > > > > > class="albumImage" > > > > > title="00_cover_arca_sonic_space_labau00s.jpg" /></div> > > > > > <div id="fragment1"> > > > > > <img src="http://localhost/lab-au.com/dev/theory/ > > > > > article_sonic-space/images/album_images/ > > > > > 01_arca_sonic_space_labau01_left_s.jpg" > > > > > class="albumImage" > > > > > title="01_arca_sonic_space_labau01_left_s.jpg" /></div> > > > > > <div id="fragment2"> > > > > > <img src="http://localhost/lab-au.com/dev/theory/ > > > > > article_sonic-space/images/album_images/ > > > > > 02_arca_sonic_space_labau02_right_s.jpg" > > > > > class="albumImage" > > > > > title="02_arca_sonic_space_labau02_right_s.jpg" /></div> > > > > > <div id="fragment3"> > > > > > <img src="http://localhost/lab-au.com/dev/theory/ > > > > > article_sonic-space/images/album_images/ > > > > > 03_arca_sonic_space_labau03_left_s.jpg" > > > > > class="albumImage" > > > > > title="03_arca_sonic_space_labau03_left_s.jpg" /></div> > > > > > <div id="fragment4"> > > > > > <img src="http://localhost/lab-au.com/dev/theory/ > > > > > article_sonic-space/images/album_images/ > > > > > 04_arca_sonic_space_labau04_right_s.jpg" > > > > > class="albumImage" > > > > > title="04_arca_sonic_space_labau04_right_s.jpg" /></div> > > > > > <div id="fragment5"> > > > > > <img src="http://localhost/lab-au.com/dev/theory/ > > > > > article_sonic-space/images/album_images/ > > > > > 05_arca_sonic_space_labau05_left_s.jpg" > > > > > class="albumImage" > > > > > title="05_arca_sonic_space_labau05_left_s.jpg" /></div> > > > > > <div id="fragment6"> > > > > > <img src="http://localhost/lab-au.com/dev/theory/ > > > > > article_sonic-space/images/album_images/ > > > > > 06_arca_sonic_space_labau06_right_s.jpg" > > > > > class="albumImage" > > > > > title="06_arca_sonic_space_labau06_right_s.jpg" /></div> > > > > > <h3> > > > > > <ul class="tab-nav-menu"> > > > > > <li><a href="#fragment0">0</a></li> > > > > > <li><a href="#fragment1">1</a></li> > > > > > <li><a href="#fragment2">2</a></li> > > > > > <li><a href="#fragment3">3</a></li> > > > > > <li><a href="#fragment4">4</a></li> > > > > > <li><a href="#fragment5">5</a></li> > > > > > <li><a href="#fragment6">6</a></li> > > > > > </ul> > > > > > <span id="imageLegend">Arca 180</span></h3> > > > > > </div> > > > > > > the call is a simple: > > > > > > var $tabs = $("#tabbedTextContent").tabs({ show: function() { alert > > > > > ('hi'); } }); > > > > > > but the tabbiffication does not occur. > > > > > > if i do $tabs.length it returns 0. > > > > > > Any hint as to where to look at the culprit would be *much* welcome ! > > > > > > Thank > > ... > > read more » --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
