Well...it's back - I feel like I'm trapped in a poltergeist movie... Any ideas?
On Tue, Jan 5, 2010 at 7:38 PM, Clayton Dukes <cdu...@gmail.com> wrote: > Ok, > I got it working by following another link on that page. > I just did this after the jquery file import: > > <!-- BEGIN Prevent FOUC > http://monc.se/kitchen/152/avoiding-flickering-in-jquery > --> > <script type="text/javascript"> > document.write('<style type="text/css">body{display:none}</style>'); > jQuery(function($) { > $('body').css('display','block'); > }); > </script> > <!-- END Prevent FOUC --> > > > On Tue, Jan 5, 2010 at 7:23 PM, Clayton Dukes <cdu...@gmail.com> wrote: >> Well... >> I spoke too soon. I was all happy that the <li>'s didn't flash, but >> didn't notice that the tabs were actually missing. >> >> Here's what I have: >> <head> >> <!-- BEGIN Prevent FOUC >> http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-unstyled-content >> --> >> <style type="text/css"> >> .js #hide_fouc {display: none;} >> </style> >> >> <script type="text/javascript"> >> document.documentElement.className = 'js'; >> </script> >> <!-- END Prevent FOUC --> >> >> Then, >> In my tabs, I have: >> <div id="tabs" class="ui-tabs" style="position: relative; top: 20px; >> left: 1px;"> >> <ul id="hide_fouc"> >> <li><a href="#tab-Main">Main</a><span class="ui-icon >> ui-icon-close">Remove Tab</span></li> >> <li><a href="#tab-Graphs">Graphs</a><span class="ui-icon >> ui-icon-close">Remove Tab</span></li> >> >> <li><a href="#tab-Table">Table</a><span class="ui-icon >> ui-icon-close">Remove Tab</span></li> >> <li><a href="#tab-About">About</a><span class="ui-icon >> ui-icon-close">Remove Tab</span></li> >> </ul> >> >> >> This just hides the tabs completely...what am I doing wrong? >> >> >> On Tue, Jan 5, 2010 at 6:53 PM, Clayton Dukes <cdu...@gmail.com> wrote: >>> That worked - thank you very much! >>> >>> >>> On Mon, Jan 4, 2010 at 12:40 AM, Steven Black <ste...@stevenblack.com> >>> wrote: >>>> Here's a nice reference on jQuery and the FOUC. >>>> >>>> http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-unstyled-content >>>> >>>> / Side question: should all functions use the $(document).ready >>>> (function() or just some? / >>>> >>>> Just some. Some things, like event bindings for example, can >>>> typically be deferred, and thus fire later. Try putting such code in >>>> >>>> $(window).load(function () { // run code }); >>>> >>>> **--** Steve >>>> >>>> On Jan 3, 11:25 pm, Clayton Dukes <cdu...@gmail.com> wrote: >>>>> Thanks for the advice :-) >>>>> I get what the site says about FUOC, but I don't quite get how to >>>>> implement it. >>>>> >>>>> I've added the classes like below, but it doesn't seem to change >>>>> anything. Am I supposed to add a css style for the classes or are they >>>>> built in? >>>>> >>>>> <div id="tabs" class="ui-tabs" style="position: relative; top: 20px; >>>>> left: 1px;"> >>>>> <ul> >>>>> <li><a href="#tab-Main">Main</a><span class="ui-icon >>>>> ui-icon-close">Remove Tab</span></li> >>>>> <li><a href="#tab-Graphs">Graphs</a><span class="ui-icon >>>>> ui-icon-close">Remove Tab</span></li> >>>>> <li><a href="#tab-Table">Table</a><span class="ui-icon >>>>> ui-icon-close">Remove Tab</span></li> >>>>> </ul> >>>>> <!-- BEGIN Tab: tab-Main --> >>>>> <div id="tab-Main" class="ui-tabs-hide"> >>>>> >>>>> Also, I have firebug, I just can't figure out why the pages are doing >>>>> what they're doing (not just the table, but things like the portlet >>>>> headers missing, etc.) >>>>> Forgive me if I sound a bit ignorant, I just started using javascript >>>>> and jquery about a month ago :-) >>>>> >>>>> > THEREFORE you either aren't saving state properly, or some Javascript >>>>> > that runs in the first instance isn't being invoked in the second >>>>> > instance. >>>>> >>>>> I'll have to dig deeper, but I suspect it's either some js not getting >>>>> reloaded, or the same js loading twice because it's in the file saved >>>>> to disk, or maybe a duplicate div id or something? >>>>> Does all that get removed completely when the tab is deleted or just >>>>> hidden somewhere? >>>>> >>>>> Side question: should all functions use the >>>>> $(document).ready(function() or just some? I have a mixture of both, >>>>> but didn't really understand when/where to use either. Is this why the >>>>> FUOC is occurring? >>>>> Again, new to this thing, sorry... >>>>> >>>>> >>>>> >>>>> On Sun, Jan 3, 2010 at 10:00 PM, Steven Black <ste...@stevenblack.com> >>>>> wrote: >>>>> >>>>> > An unrelated suggestion: Google "Flash of unstyled content" and delay >>>>> > the visibility of content until it is properly styled. >>>>> >>>>> > Related to this: you really should be developing with the aid of the >>>>> > FireFox browser with the Web Developer add-in. "Inspect Element" is >>>>> > your friend. >>>>> >>>>> > With FF + WD add-in it took me 5-seconds to ascertain that, >>>>> >>>>> > * The first instance of the Table pane, the table therein has >>>>> > element.style {width:1618 px;} (on my monitor) >>>>> >>>>> > * The second instance of the Table pane, restored after deleting, the >>>>> > table therein has element.style {width:596 px;} (on my monitor) >>>>> >>>>> > THEREFORE you either aren't saving state properly, or some Javascript >>>>> > that runs in the first instance isn't being invoked in the second >>>>> > instance. >>>>> >>>>> > Make sense? >>>>> >>>>> > Takeaway: run, don't walk, and get the FireFox Browser and add the Web >>>>> > Developer add-in. I was using right-click, Inspect Element to inspect >>>>> > the table in the Table pane. Same applies to the other panes, >>>>> > presumably. >>>>> >>>>> > **--** Steve >>>>> >>>>> > On Jan 3, 6:16 pm, Clayton Dukes <cdu...@gmail.com> wrote: >>>>> > > I've built a work-around to being able to re-add a deleted tab. >>>>> > > The workaround builds the initial pages in an array, then echo's the >>>>> > > contents out - and, at the same time, saves the contents to a temp >>>>> > > directory. >>>>> > > The reason I need to do it this way is I don't want to just "hide" >>>>> > > data >>>>> > > because some of it needs to be secured (like admin pages, etc) and >>>>> > > users >>>>> > > could easily view source. >>>>> >>>>> > > I have everything working, but for some odd reason, when I re-add the >>>>> > > page >>>>> > > from disk, some of the portlet headers are missing along with some >>>>> > > general >>>>> > > 'funkiness' and other missing items. >>>>> > > I'm stumped as to what to try and fix and was wondering if anyone >>>>> > > might be >>>>> > > able to shed some light. >>>>> >>>>> > > The website is at:http://lztest.gdd.net >>>>> > > login/pass is guest/guest >>>>> >>>>> > > If you remove any of the 3 initial tabs, you can re-add them from the >>>>> > > menu. >>>>> > > If I restore the main tab, the portlet headers don't show up (and >>>>> > > also the >>>>> > > watermarks in the time fields aren't working) >>>>> > > If I restore the graphs page, all the graphs are missing. >>>>> > > If I restore the Table page, the portlet header is missing (and, >>>>> > > oddly, the >>>>> > > table isn't sized properly). >>>>> >>>>> > > -- >>>>> > > ______________________________________________________________ >>>>> >>>>> > > Clayton Dukes >>>>> > > ______________________________________________________________ >>>>> >>>>> > -- >>>>> >>>>> > You received this message because you are subscribed to the Google >>>>> > Groups "jQuery UI" group. >>>>> > To post to this group, send email to jquery...@googlegroups.com. >>>>> > To unsubscribe from this group, send email to >>>>> > jquery-ui+unsubscr...@googlegroups.com. >>>>> > For more options, visit this group >>>>> > athttp://groups.google.com/group/jquery-ui?hl=en. >>>>> >>>>> -- >>>>> ______________________________________________________________ >>>>> >>>>> Clayton Dukes >>>>> ______________________________________________________________ >>>> >>>> -- >>>> >>>> You received this message because you are subscribed to the Google Groups >>>> "jQuery UI" group. >>>> To post to this group, send email to jquery...@googlegroups.com. >>>> To unsubscribe from this group, send email to >>>> jquery-ui+unsubscr...@googlegroups.com. >>>> For more options, visit this group at >>>> http://groups.google.com/group/jquery-ui?hl=en. >>>> >>>> >>>> >>> >>> >>> >>> -- >>> ______________________________________________________________ >>> >>> Clayton Dukes >>> ______________________________________________________________ >>> >> >> >> >> -- >> ______________________________________________________________ >> >> Clayton Dukes >> ______________________________________________________________ >> > > > > -- > ______________________________________________________________ > > Clayton Dukes > ______________________________________________________________ > -- ______________________________________________________________ Clayton Dukes ______________________________________________________________
-- You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to jquery...@googlegroups.com. To unsubscribe from this group, send email to jquery-ui+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en.
