Newsgroup: it.comp.lang.javascript
Titolo: Using OnChange method to make text visible/invisible

I am trying to get an address to change depending
on what is selected in a drop down menu box.  I
can get the text to be invisible but I can not
make it visible.  I would appreciate any help.
Here is the code I have so far.
<head>
<STYLE TYPE="text/css"><!--
   #LAT {visibility: hidden}
--></STYLE>
<script language="JavaScript">
  <!--
  function displayaddress() {
    where = "Regarding"
    if the browser is netscape {
      document.layers[where].visibility="visible"
    } else the browser is explorer {
      document.all
[where].style.visibility="visible"
    }
  }
//-->
</script>
</head>
<div id="LAT"><p><b><font face="Verdana"
size="1">Latrobe Steel</font></b></p></div>
<SELECT Name = "Regarding" OnChange
= "displayaddress()">
  <OPTION VALUE=""></OPTION>
  <OPTION VALUE="LAT" SELECTED>Specialty
Steel</OPTION>
</SELECT>
Sent via Deja.com
http://www.deja.com/


[]
Try this:
-----------
<STYLE TYPE="text/css"><!--
   #LAT {position:relative; visibility: hidden}
--></STYLE>
<script language="JavaScript">
  <!--
function displayaddress(where) {
 if (document.layers)
  document.layers[where].visibility="visible"
    else if (document.all)
  document.all[where].style.visibility="visible"
 else if (document.getElementById)
  document.getElementById(where).style.visibility="visible"
  }
// -->
</script>
</head>
<div id="LAT" ><p><b><font face="Verdana" size="1">Latrobe
Steel</font></b></p></div>
<FORM action="" method=POST id=form1 name=form1>
<SELECT Name = "Regarding" OnChange =
"displayaddress(this.options[this.selectedIndex].value)">
  <OPTION SELECTED>-------</OPTION>
  <OPTION VALUE="LAT" >Specialty Steel</OPTION>
</SELECT>
</FORM>
-----------
Saluti, Paolo

,



 Nick
You need to nest the layers, with absolute position, into another with
relative position and then change the script to alternate visibility.
Saluti, Paolo
------------
<STYLE TYPE="text/css"><!--
   #cont {
   position: relative;
   }
   .LAT {
   position: absolute;
   visibility: hidden;
   font-family: "Verdana";
   font-size: x-small ;
   font-weight: bold;
   }
--></STYLE>
<script language="JavaScript">
  <!--
  oldLayer='LAT'
function displayaddress(where) {
 if (document.layers){
 doc=document.layers['cont'].document;
 doc.layers[oldLayer].visibility="hidden"
 doc.layers[where].visibility="visible"
 }
    else if (document.all){
 document.all[oldLayer].style.visibility="hidden"
 document.all[where].style.visibility="visible"
 }
 else if (document.getElementById){
 document.getElementById(oldLayer).style.visibility="hidden"
 document.getElementById(where).style.visibility="visible"
 }
 oldLayer=where;
  }
// -->
</script>
</head>
<body>
<div id="cont">
 <div class="LAT" id="empty" >&nbsp;</div>
 <div class="LAT" id="LAT" >Latrobe Steel</div>
 <div class="LAT" id="LAT1" >Latrobe Steel1</div>
 <div class="LAT" id="LAT2" >Latrobe Steel2</div>
<div>
<br>
<FORM action="" method=POST id=form1 name=form1>
<SELECT Name = "Regarding" OnChange =
"displayaddress(this.options[this.selectedIndex].value)">
  <OPTION SELECTED value="empty">-------</OPTION>
  <OPTION VALUE="LAT" >Specialty Steel</OPTION>
  <OPTION VALUE="LAT1" >Specialty Steel1</OPTION>
  <OPTION VALUE="LAT2" >Specialty Steel2</OPTION>
</SELECT>
</FORM>
-------------