ahh, nice. Ok, I can work with this methods. Thanks Spinnach! On Sep 19, 5:29 am, spinnach <[EMAIL PROTECTED]> wrote: > one solution i've been using is dynamic css, which (before the page is > loaded) adds css via javascript, so without js, the whole page will be > displayed normally, and with js on, the css will be added and, in your > case, hide the elements you want to be hidden.. > > http://www.bobbyvandersluis.com/articles/dynamicCSS.php > > dennis. > > Pops wrote: > > Now that I finding myself doing the following in a few areas, I don't > > quite like it for a finalization of the code. > > > Basically, for the most part, a good bit of my jQuery usage is to add > > dynamic toggling of current views already established in various pages > > in our package. > > > In some cases, I want the page to start with views not showing, and > > others I want the views showing, and yet in others, I want some views > > with common elements having maying the first element showing and the > > rest hidden, etc. > > > I guess the beauty of jQuery is that you mark up pages with little to > > no changes. But in some cases, you also have to modify the pages. I > > am trying to avoid modifying pages. > > > Anyway, to illustrate one example, I have one page with the > > following: > > > $(document).ready(function(){ > > //---------------------------------------------------------- > > // - Click title row to toggle the remaing table rows. > > //---------------------------------------------------------- > > var $f = $(".divTitle"); > > //$f.next("div").hide(); > > $f.click(function() { > > var $i = $(this).next("div:first").toggle(); > > if ($i.is(":hidden")) { > > $("img:first",this).attr("src","images/closed.gif"); > > } else { > > $("img:first",this).attr("src","images/open.gif"); > > } > > }); > > $f.click(); > > //---------------------------------------------------------- > > }); > > > This handles existing html that has a patten like so: > > > <H3>FAQ<H3> > > > <p class="divTitle"> > > <img src="images/open.gif"/> FAQ #1?</p> > > > <div> > > <p>blah, blah.....<p> > > </div> > > > <p class="divTitle"> > > <img src="images/open.gif"/> FAQ #2</p> > > > <div> > > <p>blah, blah.....<p> > > </div> > > > etc.... > > > Note: in the above, it is done so that in a non-JS browser (JS > > disabled), the items will be "open" as it is shown now without jQuery > > implemented into this particular page. > > > The issue is that is that the initial display is not snappy when the > > connection is over the wire. It also depends on the browser. > > > I guess I want to get a discussion of different ideas of how to make > > it snappy, i.e, so that there no flipping of views. > > > Traditionally, in graphical or display UI, one trick is to hide the > > whole thing until it is done and then turn it on. That didn't seem to > > work with the browser. > > > It sounds that I really need to use CSS more here if I want the > > browser to render this display with little dynamic changes? > > > Is this a scenario where a "element.ready()" idea is appropiate? so > > that its initial programmatic state can be establishing before the > > rendering takes place? > > > Of course, if this gets too complicated, I will probably just end up > > modifying the pages with appropiate style initial classes. But jQuery > > never stops to surprise me with what it can do, so if you have any > > tips or suggestions here, I would love to here them. > > > TIA > > > -- > > HLS
