Switch Content Script

[pcinfoman]

1) Script Title: Switch Content Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tchcontent.htm

3) Describe problem: The script works perfectly. However, every time you go to the page, it displays the hidden area until the page loads and then it disappears until you press the link. Normally, this would be fine, but the part of the page I am using this script for is in the header so this happens every time you navigate to a new page.

See for yourself at http://www.animalmakers.com/Catalog/

The link that says "Start Your Project Today!" goes to a form that appears when you press it. However, the form shows up fully extended on each page until the page completely loads.

How do I make it so it does not show up at all UNLESS the link is pressed?

[Sliight]

I just checked out his page, and to describe the problem a touch differently... if you click the "start your project today" it opens up a form page. If you want to go somewhere else that form page just stays loaded regardless of where you go on his page. So it appears that every page is that form, and none of his other content is visible.

I'm not sure how to resolve this correctly, but if you don't get any responses that help, I would probably create a whole seperate page that opens in a pop up with this form, that way they never navigate away, and can still open the form. That's the fastest way I can think of to resolve it...

<p><a href="/newpage.html" onclick="NewWindow(this.href,'name','700','900','yes');return false">Start your project today!</a>

You can probably drop the '700','900', or readjust it to fir the proper width/height

[pcinfoman]

Actually, the code is in a php included file that is included on every page. I want that to be like that. What I do not want, it the hidden form to display and then go away every time the page (or any page) is loaded. I used to have something similar in place and it did not behave like this. I know it can be done, I just do not know how.

Thanks for the offer of the popup code, but many of my users block popups. I do not want a popup form, I want an inline hidden form until the link is "Display" pressed.

[ddadmin]

The fact that the switch contents are visible until after the page loads is intentional, for accessibility reasons. It means if a visitor has JavaScript disabled, the content is still visible (and not contracted). If you wish your switch contents to be contracted from the very start, you can do so using CSS and targetting the switch contents' shared CSS class. Assume you have the below when initializing the script:

var bobexample=new switchcontent("switchgroup1", "div")
"
"

The shared CSS class in this case is "switchgroup1", which you can hide using CSS:

<style type="text/css">
.switchgroup1{
display: none;
}
</style>

The only caveat to this that I'm aware of is that it renders the defaultExpanded() function useless, meaning even if you specify that a DIV should be expanded by default, it will still appear contracted due to the global CSS hiding it.

[pcinfoman]

So, just add the stylesheet and that is it?

I did that and it seems to work fine. Thank you very much. You just solved a major headache for me.