PDA

View Full Version : Switch content hide link inside the expanded div



yahooman122
04-03-2009, 03:43 PM
1) Script Title: Switch Content Script

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

3) Describe problem:

I am trying to create a link inside the expanded content that will close that current expanded content. For example a button that says "Hide" and when clicked the current expanded content closes.

I tried using the collapse all feature, but this collapses all expanded boxes like it is supposed to.

ddadmin
04-03-2009, 09:53 PM
Try adding the below script to your page:


<script type="text/javascript">

function closeheader(switchinstance, header){
var header=document.getElementById(header)
switchinstance.contractcontent(header)
}

</script>

It lets you contract a header from anywhere on the page, such as inside the content itself. As an example:


<h3 id="bobcontent1-title" class="handcursor">What is JavaScript?</h3>

<div id="bobcontent1" class="switchgroup1">
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.

<a href="javascript:closeheader(bobexample, 'bobcontent1-title')">Close</a>

</div>

Where bobexample should be the variable name of this Switch Content instance, and 'bobcontent1-title' the ID of the header which you wish to collapse.

yahooman122
04-04-2009, 08:18 PM
Worked perfectly! Thank you!