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.
