[thelist] Re: js/css show div based on onchange
Jono
ox4dboy at comcast.net
Thu Oct 21 12:11:40 CDT 2004
On Oct 21, 2004, at 10:41 AM, Courtenay wrote:
> Yeah, but it breaks for no javascript.
> Also, tables are passe! Yes, its a cheeky response, but here goes.
>
This worked for me a while back.
[+] Works on a lot of browsers, even NN4.
[+] short and sweet, but not a huge amount of flexability
[-] Not really slick CSS, uses tables which were designed for what I
was doing.
[-] does not work with external style sheet.
<style type="text/css">
#dns2 div {display:none;}
</style>
<!--JavaScript for Pulldown -->
//this is the script that hides and shows from the pulldown menu
function show(which){
m=document.getElementById("dns2");
trig=m.getElementsByTagName("div").item(which).style.display;
if (trig=="block") trig="none";
else if (trig=="" || trig=="none") trig="block";
m.getElementsByTagName("div").item(which).style.display=trig;
}
<!-- end JavaScript for Pulldown -->
<!-- H T M L Select Pulldown -->
<tr>
<td><select name="whatever" onChange="javascript:show(0)">
<option value="dns1" selected>Primary</option>
<option value="dns2">Secondary</option>
</select>
</td>
</tr>
<!-- H T M L area that is revealed/hidden from pulldown -->
<div id="secondary">
<table>
<tr>
<td>...</td>
</tr>
<tr>
<td>...</td>
</tr>
<td>...</td>
<td>...</td>
<td>...</td>
<td>...</td>
</tr>
</table>
</div>
<!-- End H T M L -->
More information about the thelist
mailing list