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
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';
  }
}

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • 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.