[jQuery] minimizing flicker of content for document ready

2009-04-02 Thread tonywhite

I have lots of scenarios on a pretty content-heavy and js-dependent
site.  I'm using jquery, and I'm trying to think of an effect way to
serve unique styles to non-js users.

Ideally, I would use javascript to link to a new external sheet.  My
development environment is not allowing a creation of a new sheet to
maintain, so I'm going to have CSS rules specific for JS disabled vs.
JS enabled users.

I was curious about the approach below, and wondered if putting this
script block immediately following the body tag would help minimize
any flicker for js-enabled users.  Would the actions here happen
faster than if I put this same line within a $(document).ready(function
() block (which already has LOTS of lines of code.

Here's my proposed HTML with the jquery script tag:
body class=jsDisabled
script type=text/javascript$('body').removeClass
('jsDisabled').addClass('jsEnabled');/script


then in my css I have rules for
.jsDisabled .submit { display:none; }
.jsEnabled .submit { color: yellow; }

That kind of thing.



[jQuery] noob question - load function - dynamic content to slide in place

2007-07-24 Thread tonywhite

I'm new to jQuery and can't figure this one out.

Instead of using an ajax get and innerHTML to load in external html, I
can just use jQuery's load function:

$(emptyDiv).load(externalHTMLFile);

which I like!

I would like to do is make better use of the graceful animations that
jQuery has.  I would prefer that the external HTML not show up so
suddenly, but instead to slide or fade in place.  It's not clear to me
how to make that happen.  I tried chaining, but by the time the
content is loaded, the chained animation doesn't really do the trick:

$emptyDiv).load(externalHTMLFile, function()
{$emptyDiv.slideDown('slow');});

If you know of answer, please share.  Thanks for any help.

Tony



[jQuery] Re: noob question - load function - dynamic content to slide in place

2007-07-24 Thread tonywhite

Cool - I get it now.

I found that my problem was really that the target div for inserting
my HTML wasn't set to display:none; to begin with, so animating it to
a block state was just not happening.

Thanks for your response - I appreciate the group.

On Jul 24, 11:08 am, Benjamin Sterling
[EMAIL PROTECTED] wrote:
 Tony,
 try:
 (for an ID)
 $('#emptyDiv').load(externalHTML, function(){
 $(this).slideDown('slow');

 });

 (for a class)
 $('.emptyDiv').load(externalHTML, function(){
 $(this).slideDown('slow');
  });

 On 7/24/07, tonywhite [EMAIL PROTECTED] wrote:





  I'm new to jQuery and can't figure this one out.

  Instead of using an ajax get and innerHTML to load in external html, I
  can just use jQuery's load function:

  $(emptyDiv).load(externalHTMLFile);

  which I like!

  I would like to do is make better use of the graceful animations that
  jQuery has.  I would prefer that the external HTML not show up so
  suddenly, but instead to slide or fade in place.  It's not clear to me
  how to make that happen.  I tried chaining, but by the time the
  content is loaded, the chained animation doesn't really do the trick:

  $emptyDiv).load(externalHTMLFile, function()
  {$emptyDiv.slideDown('slow');});

  If you know of answer, please share.  Thanks for any help.

  Tony

 --
 Benjamin Sterlinghttp://www.KenzoMedia.comhttp://www.KenzoHosting.com