Question

First off, i’m a front end designer/developer with very very minimal javascript and PHP knowledge.

I’m using the ‘Switch Content Script’ which I found on Dynamic Drive – http://www.dynamicdrive.com/dynamicindex17/switchcontent.htm

This is how i’ve incorporated it in to the site i’m developing for a friend http://www.davidatkinson.com/ss-testarea

My question is, with that Switch Content Script, is it possible to modify it to have one of the content DIVS display automatically when visiting the site?

In the source code you’ll see that I managed a botch job (I know, I can see you cringing now) using jQuery toggle script. I’ve commented out the HTML as it was conflicting with the PHP contact form i’m using. When you click the send button, the page refreshes, and by doing so it was displaying panel I was loading by default.
So for now, i’ve decided to pass on using the jQuery botch job, in the hope someone may be able to help me with modifying the Switch Content Script.

I was thinking of just using the jQuery toggle script (as i’ve done here) instead of the Switch Content Script, but I figure i’m going to come across the same stumbling blocks?

If anyone can help, the whole site can be downloaded here

Thanks in advance 🙂

Answer 1

EDIT: Adding switchcontent.prototype.defaultExpanded(0) after line 19 in index.php, or just before your jquery starts will open the first one, simply change the 0 to any number to open whicher content box you wish to 😉

If you read the documentation for that switch content script you can see that they have a function for auto expanding an instance on load.

instance.defaultExpanded(indices)

this is from the doc:

By default, the script will contract all contents within a switch
group when the page first loads. Use this method to specify those
contents that should be expanded by default, by entering their index
(position) relative to the other contents inside the group, each
separated by a comma (,). Parameter: Indices of the contents to be
expanded by default relative to the rest of the contents (starts at
0). A few examples:

instance.defaultExpanded(0) //1st content expanded
instance.defaultExpanded(0,1) //1st and 2nd content expanded
instance.defaultExpanded(3,5) //3rd and 5th content expanded

Exceptions: Two conditions if met will override this setting:

If setPersist() is enabled, the persisted states takes precedence. If
collapsePrevious() is enabled, then only the first content set to
expand by default will be expanded, as collapsePrevious() means only
one content can be open at any given time.