Well, they start by hiding various page elements and then fading them back in,
sometimes in weird ways. So I need the hiding part to happen as soon as
possible so that there's no "flicker of content". document.ready() hasn't
caused me any problems in that regard so far when the animations are the only
thing on the page. That's what leads me to think that it's a sync issue with
all the other code that's now running.
--Larry Garfield
On Wed, 15 Aug 2007 14:56:50 -0700, "Erik Beeson" <[EMAIL PROTECTED]> wrote:
> You might try moving your opening animations to $(window).load(function()
> {...});
>
> --Erik
>
>
> On 8/15/07, Larry Garfield <[EMAIL PROTECTED]> wrote:
>>
>>
>>
>> Good <insert time of day here> jQuery.
>>
>> I have a site where I have a series of animations that need to run on
>> load. I also have a large number of other events that happen on load to
>> setup various other effects and animations and modal popups and other
>> goodness. Individually, I have all of them working (yay!). However,
> when I
>> put them all together in the page the opening animation is very herky
> jerky
>> (boo!). I'm assuming that's because the animation happens on ticks, and
>> ticks are delayed by other non-trivial hookup functions that are running
> on
>> $(document).ready(). So I'm having, essentially, thread sync issues
> (yay!).
>>
>> Since none of the other hookup functions really *have* to happen
>> immediately, but could happen after the opening animation (presumably no
> one
>> is going to be clicking on links while parts of the page are still
> fading
>> in), my thinking is to simply have the hookups not fire on
> document.readybut on
>> animation.complete. They're all residing in different files, however,
> and
>> merging everything into one big script would be a huge hassle as well as
>> much more brittle code. I also want to keep it modular so that I don't
> have
>> to hard-code every init function into the animation routines.
>>
>> Sooo...
>>
>> My plan at this point is to introduce a new event,
>> document.animationIsDoneSoPageIsReallyReady (or something less silly
>> sounding), and have the other hookups fire on that event instead. So
> the
>> code would look like:
>>
>> $(document).ready(function() {
>> // Do animation stuff here.
>>
>> $(document).trigger('reallydone');
>> });
>>
>> // in another file
>> $(document).bind('reallydone', function() {
>> // Hook up jqModal.
>> });
>>
>> // in another file
>> $(document).bind('reallydone', function() {
>> // Hook up a different jqModal.
>> });
>>
>> // in another file
>> $(document).bind('reallydone', function() {
>> // Hook up some scrolling effects and other weirdness.
>> });
>>
>> So my questions to the audience are:
>>
>> 1) Is my analysis of the problem correct?
>>
>> 2) Is this a reasonable way to go about solving it?
>>
>> 3) Is my code sample above somewhat vaguely accurate?
>>
>> 4) Any suggestions or gotchas that could save me some hair? :-)
>>
>> Many thanks.
>>
>> --Larry Garfield
>>
>>
>
>
