Jump to content

Adding a plus and minus to open/close


wispas

Recommended Posts

i have a script that expands and collapses a div tag when the a:link has been clicked.

 

i have added an extra div at the bottom called status and wanted it to display some words as to whether the box is expanded or collapsed;

 

can anyone help me with this...

im guessing its adding some code into the javascript that i already have.

 


<html>
<head>
<title>Show/Hide Element</title>

<script type="text/javascript">

function showHide(div){

if(document.getElementById(div).style.display == 'none'){
     document.getElementById(div).style.display = 'block';
  }else{
    document.getElementById(div).style.display = 'none';
  }
}

</script>
</head>

<body>

<a href="#"><div id="filter" onClick="showHide('filtersearch');">Filter Search Results</div></a>
<div id="filtersearch" style="display:none;">Put content here</div>

<div id="status"></div>

</body>
</html>

Link to comment
https://forums.phpfreaks.com/topic/199242-adding-a-plus-and-minus-to-openclose/
Share on other sites

edit your javascript function to look something like this.

function showHide(div)
{ 
  if(document.getElementById(div).style.display == 'none')
  {     
    document.getElementById(div).style.display = 'block';  
    document.getElementById('status').innerHTML = 'open';  
  }
  else
  {    
    document.getElementById(div).style.display = 'none';  
    document.getElementById('status').innerHTML = 'close';
  }
}

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.