eskimoblood,
I'm very much a novice when it comes to javascript - can you explain
the first part a bit more. Where does this code go? In the main
page, the javascript page, etc? I should note I'm linking to the
javascript externally in the <head>.
I think I understand where to place the css. The page is actually a
coldfusion page and the elements are called in as templates. So,
there is a header, a content section, and a few other columns. One of
the columns calls in the accordion which is its own CFtemplate file.
The accordion has its own css page (external), so I'm guessing I place
the css in that.
Any help is greatly appreciated!
On Nov 21, 3:27 am, eskimoblood <[EMAIL PROTECTED]> wrote:
> I'm using a simple document.body.className = 'jsActive' script direct
> after the opening body tag and this piece of css :
> .jsActive .accordionContent {
> position: absolute;
> top: -100000px;
>
> }
>
> On 20 Nov., 22:29,mshetler<[EMAIL PROTECTED]> wrote:
>
>
>
> > I'm having the same issue of all the content of the accordion being
> > visible on page load. Once the page loads it works perfectly.
>
> > Did you ever find a good solution?
>
> > On Oct 21, 2:05 pm, keif <[EMAIL PROTECTED]> wrote:
>
> > > 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
> > > >accordionbut 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- Hide quoted text -
>
> > > - Show quoted text -- Hide quoted text -
>
> - Show quoted text -
