PDA

View Full Version : Resolved switch content script - groups start out opened instead of closed?



switchcontent
07-02-2012, 01:40 PM
1) Script Title: Switch Content Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/switchcontent.htm

3) Describe problem: How can I change the script so that the groups are open when the page loads instead of closed? I only know the basics of js so I find some of the script to be confusing (even though it's commented out pretty well).

jscheuer1
07-02-2012, 02:01 PM
In the body of the page, where you have something like so after the markup for the switch content:


<script type="text/javascript">
// MAIN FUNCTION: new switchcontent("class name", "[optional_element_type_to_scan_for]") REQUIRED
// Call Instance.init() at the very end. REQUIRED

var bobexample=new switchcontent("switchgroup1", "div") //Limit scanning of switch contents to just "div" elements
bobexample.setStatus('<img src="http://img242.imageshack.us/img242/5553/opencq8.png" /> ', '<img src="http://img167.imageshack.us/img167/7718/closedy2.png" /> ')
bobexample.setColor('darkred', 'black')
bobexample.setPersist(true)
bobexample.collapsePrevious(true) //Only one content open at any given time
bobexample.init()
</script>

Make that like:


<script type="text/javascript">
// MAIN FUNCTION: new switchcontent("class name", "[optional_element_type_to_scan_for]") REQUIRED
// Call Instance.init() at the very end. REQUIRED

var bobexample=new switchcontent("switchgroup1", "div") //Limit scanning of switch contents to just "div" elements
bobexample.setStatus('<img src="http://img242.imageshack.us/img242/5553/opencq8.png" /> ', '<img src="http://img167.imageshack.us/img167/7718/closedy2.png" /> ')
bobexample.setColor('darkred', 'black')
bobexample.setPersist(false)
bobexample.collapsePrevious(false)
bobexample.defaultExpanded(0,1,2,3,4)
bobexample.init()
</script>

Note that the setPersist and collapsePrevious are both false. The defaultExpanded is a little tricky. You want them all derfault expanded. 0 is the first, 1 is the second, 2 is the third, and so on. So if you only have three, just put:


bobexample.defaultExpanded(0,1,2)

If you have 7:


bobexample.defaultExpanded(0,1,2,3,4,5,6)

I think you see how that goes.

That's it.

The browser cache may need to be cleared and/or the page refreshed to see changes.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

switchcontent
07-02-2012, 02:36 PM
EDIT: Forget everything I wrote below I figured out what I did wrong and now I feel extremely dumb. I forgot that the function names were case sensitive so when I was trying to use defaultexpanded(0,1,2,3,4,5,6) it wouldn't expand because that doesn't exist. So all I needed to do was change it to defaultExpanded(0,1,2,3,4,5,6) and it worked. Lesson learned. Thanks for the help!


Thank you for replying, unfortunately though, I've tried that already. When I run it with the defaultexpanded it starts expanded but then I can't retract it and the retract/expand image isn't there.

Here is the html for the menu I need to start expanded:

<script type="text/javascript" src="switchcontent.js"></script> <!-- importing script for drop downs -->

<div id="menugroup1-title" class="switch_link">
<h2>Menu</h2>
</div> <!-- End switch_link -->

<div id="menugroup1" class="switchgroup1">
<ul>
<li><a href="#">Conference Rooms</a></li>
<li><a href="#">Teleconference Bridge</a></li>
<li><a href="#">Firm Bulletin Board</a></li>
<li><a href="#">Firm Newsletter</a></li>
<li><a href="#">Firm Phonebook</a></li>
<li><a href="#">Firm Policies</a></li>
<li><a href="#">Request For E-Filing Form</a></li>
</ul>
</div> <!-- End switchgroup1 -->

<script type="text/javascript">
var menugroup=new switchcontent("switchgroup1", "div")
menugroup.setStatus('<div id="leftdropbox"><img src="images/close.gif" alt="-" title="-" /></div>', '<div id="leftdropbox"><img src="images/open.gif" alt="-" title="-" /></div>') //set icon HTML
menugroup.collapsePrevious(false)
menugroup.setPersist(false)
menugroup.defaultexpanded(0,1,2,3,4,5,6)
menugroup.init()
</script>

And I'm not sure if the script is different and maybe that's causing the problem but here's the code from the switchcontent.js I'm using: http://pastebin.com/D4Ceqxx4

jscheuer1
07-02-2012, 03:11 PM
You've got the latest script, identical.

In your post, where you have:



menugroup.defaultexpanded(0,1,2,3,4,5,6)

That's a typo. The first e in expanded needs to be upper case:


menugroup.defaultExpanded(0,1,2,3,4,5,6)

Just fixing that much made your markup work for me.

However, in your post you don't have 7, you only have one. It's expanded onload and can be contracted/expanded by clicking on:

Menu