Hide / Show DIV Onclick Tutorial

Ever wanted to be able to hide / show a DIV(layer)? Well i found the perfect script to help out. The original post came from: http://www.webmasterworld.com/forum91/441.htm

I used the script when creating a recipient list with categories. Onclick of the title name it drops down the contacts included in that list.

—————————————-

A friend of mine is using this JS code in the header:

<script language=”javascript”> <!– var state = ‘none’; function showhide(layer_ref) { if (state == ‘block’) { state = ‘none’; } else { state = ‘block’; } if (document.all) { //IS IE 4 or 5 (or 6 beta) eval( “document.all.” + layer_ref + “.style.display = state”); } if (document.layers) { //IS NETSCAPE 4 or below document.layers[layer_ref].display = state; } if (document.getElementById &&!document.all) { hza = document.getElementById(layer_ref); hza.style.display = state; } } //–> </script>

and this html code for each division that is to be hidden/shown:

<p><a href=”#” onclick=”showhide(‘div1′);”>show/hide me</a></p> <div id=”div1″ style=”display: none;”>This is the content</div>

(use different IDs for different divisions)

The difference between using the css tags ‘visibility’ and ‘block’ is that with ‘block’ the layout will be updated as well.

——————

There are a few additional posts regarding NS4 updates to working with other browsers so check it out.

Introducing WGC Designs..

Whether you need a new website or need to improve an existing website or a specialized idx real estate website we have the tools to get the job done. Our Web Hosting servers are designed to meet the high security, speed and safety demands for your website and email system. Whether it is a collection of family photos or a business, we know how vital it is to have your website always available. Our databases are created to be functional to help facilitate the daily operation of your business. We develop secure, encrypted, eCommerce websites that enable your customers to conveniently purchase products and services. We ensure intelligent search engine promotion. No matter how awesome or useful your website is, your valueable information would never be found or appreciated by it;s audience without it. Also check out our line of virtual tours and virtual tour lenses.