MattsBits
MattsBits - Brunel District

MattsBits

MattsBits RSS Feed - Subscribe Now!

23/04/2009 : Show Or Hide HTML Items Using JavaScript

Categories : | JavaScript | Views : 354 | Email Link Print

Using this Javascript function you can toggle the visibility of HTML items by their ID.

Include the following in the <head> of your web page :

<script type="text/javascript">
<!--
function toggleID(id) {

  if (document.getElementById(id).style.display=='none') {
    document.getElementById(id).style.display='block';
  } else {
    document.getElementById(id).style.display='none';
  }  
}
// -->
</script>

Then ensure the HTML element you wish to show/hide has an ID attribute defined, eg :

<div id="my_div">This is an example DIV</div>


Calling the JavaScript function and passing it "my_div" will toggle the visibility of the div, eg :

<a href="#" onclick="javascript:toggleID('my_div');return false;">Click here</a>

Technorati Tags : | javascript |

Author : Matt Hawkins  Last Edited By : Matt Hawkins  Permalink : Show Or Hide HTML Items Using JavaScript
 
 
 
PHP Powered  MySQL Powered  Valid XHTML 1.0  Valid CSS  Firefox - Take Back The Web  EUKHost - Recommended Webhosting Solutions

MattHawkins CMS v2.0 - Copyright 2009-2010