Move your JS to the header.
I'm assuming you have your page set out like:
[css]
[/head]
[body]
[content]
[scripts]
[/body]
I've found that be moving the library to the header, along with the
domready events, they're executed faster than in the footer.
(The pages used for these tests were both simple text, and a page with
OMG HUGE PNGS).
On Oct 20, 3:57 pm, Sapslabs <[EMAIL PROTECTED]> wrote:
> I have this code executed on the domready function
>
> window.addEvent('domready', function() {
>
> var fx = [];
> $$('.contentholder').each(function(item, index){
> var index = fx.length;
> myid = item.id;
>
> fx[myid] = new Fx.Slide(item.id);
> fx[myid].hide()
> });
>
> $$('.acclinks').each(function(item, index){
> item.addEvent('click', function(el){
> myid = item.id;
> myid = myid.replace(/_button/g, "_content");
> fx[myid].toggle();
> });
> });
>
> });
>
> This will get all the links with the class acclinks and make them
> toggle their specific div. The code works perfectly (is like an
> accordion but each element is independent form one another so that I
> can have any number of them open at one time). The problem is that as
> soon as the page loads, I see all the content and then it quickly gets
> hidden byt the function.
>
> Is there any way to assure that the DOM is loaded, javascript loaded
> and function called, before the rest of the page? I want the page to
> load with everything hidden at once since I don't want the user to see
> the content flash and then disappear.
>
> Thanks
