PDA

View Full Version : title to open the content



rich1234
11-08-2008, 03:27 PM
Switch Content Script 2

http://www.dynamicdrive.com/dynamicindex17/switchcontent2.htm


Hi I just wondered if its possible to have the content viewed not only by clicking the minus or plus icon but by the text too. For example


<div class="eg-bar darkdash"><span id="faq99-title" class="iconspan"><img src="minus.gif" alt="open image" /></span><h4>submit</h4></div>
<div id="faq99" class="icongroup3">
I have this but would also want the H4 text to be a link to open the content, just like the basic script does.
http://www.dynamicdrive.com/dynamicindex17/switchcontent.htm

Thanks
Richard

ddadmin
11-09-2008, 06:54 AM
You can try calling the method:

switchcontentinstance.toggledisplay(header) manually inside the header text you wish to also act as a toggler. For example, note the code in red below:


<h2>Demo 1:</h2>
<p><a href="javascript:faq.sweepToggle('contract')">Contract All</a> | <a href="javascript:faq.sweepToggle('expand')">Expand All</a></p>

<div class="eg-bar"><span id="faq1-title" class="iconspan"><img src="minus.gif" /></span><span onClick="faq.toggledisplay(document.getElementById('faq1-title'))">What is JavaScript?</span></div>
<div id="faq1" class="icongroup1">
JavaScript is a scripting language originally developed by Netscape to add interactivity and power to web documents. It is purely client side, and runs completely on the client's browser and computer.
</div>
<br />

<div class="eg-bar""><span id="faq2-title" class="iconspan"><img src="minus.gif" /></span><span onClick="faq.toggledisplay(document.getElementById('faq2-title'))">Difference between Java & JavaScript?</span></div>
<div id="faq2" class="icongroup1">
Java is completely different from JavaScript- the former is a compiled language while the later is a scripting language.
</div>
<br />

<div class="eg-bar""><span id="faq3-title" class="iconspan"><img src="minus.gif" /></span><span onClick="faq.toggledisplay(document.getElementById('faq3-title'))">What is DHTML?</span></div>
<div id="faq3" class="icongroup1">
DHTML is the combining of HTML, CSS, and JavaScript.
</div>
<br />

<script type="text/javascript">

var faq=new switchicon("icongroup1", "div") //Limit scanning of switch contents to just "div" elements
faq.setHeader('<img src="minus.gif" />', '<img src="plus.gif" />') //set icon HTML
faq.collapsePrevious(true) //Allow only 1 content open at any time
faq.setPersist(false) //No persistence enabled
faq.defaultExpanded(0) //Set 1st content to be expanded by default
faq.init()

</script>