Links

Lists

Latest Updates

Ruby On Rails List
Python list
Advanced Java
The JavaScript List
Apache Users
Full Disclosure
Linux Security

Search the archives!
Having a development problem? Ask eDevelopment.org forums!

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

[Javascript] Need help in Hiding Controls inHTML

  • From: javascript@xxxxxxxxxx (Muchacho, Laurent (TWIi London))
  • Subject: [Javascript] Need help in Hiding Controls inHTML
  • Date: Mon, 25 Nov 2002 10:38:07 -0000
This message is in MIME format. Since your mail reader does not understand
this format, some or all of this message may not be legible.

------_=_NextPart_000_01C2946E.BDCEB830
Content-Type: text/plain;
	charset="iso-8859-1"

Hi

I built the example shown below but my sever is done at the moment I don't
have any server at the moment to host my page I just attach the file.

Laurent


-----Original Message-----
From: Evans Ligare [mailto:eligare@xxxxxxxxxxxx]
Sent: 23 November 2002 15:39
To: javascript@xxxxxxxxxx
Subject: [Javascript] Need help in Hiding Controls inHTML


Hi,

I have run into a similar problem you encountered. This is part of the 
responses I have from the web about your search for the solution.
However, the site pointed to is not up. Please post me some guidelines
on how you solved the problem.

Thanks in advance,
Evans.

I got a examples who work cross browser this might help
<http://www.persistenz.com/samples/hideSelect.htm> 
Laurent -----

Original Message----- 
From: Matthieu F=E9ron [mailto:mferon@xxxxxxxxx <mailto:mferon@xxxxxxxxx>] 
Sent: 03 October 2001 14:11 To: javascript@xxxxxxxxxx
<mailto:javascript@xxxxxxxxxx> 
Subject: Re: [Javascript] hiding form controls?
 perhaps put the form in a layer and hide the layer ?? 
> howdystranger a =E9crit : >=20 > I'm having a problem writing a javascript
routine that will change 
> the visibility property of a form control. I was thinking of giving 
> the form control a certain style and then using a javascript funtion 
> to change the visibility property of that style based on the 
> parameter passed in. 
>=20 >
 I'm using hiermenus and I basically just want to hide drop down form 
> controls when the menu appears. 
>=20 
> thanks for any help.. PJ 

_______________________________________________
Javascript mailing list
Javascript@xxxxxxxxxx
https://lists.LaTech.edu/mailman/listinfo/javascript


DISCLAIMER - The preceding e-mail message (including any attachments)
contains information that may be confidential, may be protected by the
attorney-client or other applicable privileges, or may constitute non-public
information.  It is intended to be conveyed only to the designated
recipient(s) named above.  If you are not an intended recipient of this
message, or have otherwise received it in error, please notify the sender by
replying to this message and then delete all copies of it from your computer
system.  Any use, dissemination, distribution, or reproduction of this
message by unintended recipients is not authorized and may be unlawful. The
contents of this communication do not necessarily represent the views of
this company.
  


------_=_NextPart_000_01C2946E.BDCEB830
Content-Type: application/octet-stream;
	name="hideSelect.htm"
Content-Transfer-Encoding: quoted-printable
Content-Disposition: attachment;
	filename="hideSelect.htm"

<html>
<head>
<title>hide Drop Down</title>
<style>
<!--
#select1		{position:absolute; left: 0px; top: 80px; width:200px; =
height: 50px; visibility:visible; z-index: =
100;BACKGROUND-COLOR:#E7EDFF;}
#select2		{position:absolute; left: 200px; top: 80px; width:200px; =
height: 200px; visibility:visible; z-index: =
100;BACKGROUND-COLOR:#E7EDFF;}
#select3		{position:absolute; left: 400px; top: 80px; width:200px; =
height: 200px; visibility:visible; z-index: =
100;BACKGROUND-COLOR:#E7EDFF;}
#select4		{position:absolute; left: 600px; top: 80px; width:200px; =
height: 200px; visibility:visible; z-index: =
100;BACKGROUND-COLOR:#E7EDFF;}
#select5		{position:absolute; left: 0px; top: 450px; width:200px; =
height: 200px; visibility:visible; z-index: 100;}
//-->
</style>
<script language=3D"JavaScript1.2">
<!--
d =3D document;
ns5 =3D (d.getElementById&&!document.all)? true:false
ns4 =3D (d.layers)? true:false
ie4 =3D (d.all)? true:false

NS6 =3D (document.getElementById&&!document.all)
IE =3D (document.all)
NS =3D (navigator.appName=3D=3D"Netscape" && =
navigator.appVersion.charAt(0)=3D=3D"4")
//construie cette array avec ton asp
var arrayFont =3D '';
arrayFont =3D ["helvetica","bookman old style","century gothic","comic =
sans ms","courier =
new","garamont","georgia","haettenschweiler","impact","lucida =
console","modern","monotype corsiva","palatino =
linotype","roman","script","tahoma","time new roman","trebuchet =
ms","verdana"];
//write the box in javascript
var strOutput;
strOutput =3D "<SELECT name=3D\"dF\">"
strOutput =3D strOutput + "<option value=3D\"0\">helvetica</option>"
for(var i =3D 0; i <arrayFont.length; i++){
strOutput =3D strOutput + "<option =
value=3D\""+i+"\">"+arrayFont[i]+"</option>"
}
strOutput =3D strOutput + "</select>"
var fontSelect =3D strOutput ;
var openForm =3D '<FORM action=3D\"hideSelect.htm\" method=3D\"get\" =
name=3D\"form1\">';
var closeForm =3D '</FORM>';
var TypeText =3D '<INPUT TYPE=3DTEXT NAME=3D\"BW\" MAXLENGTH=3D4 =
SIZE=3D4 WIDTH=3D30 VALUE=3D\"700\">';
var typeSubmit =3D '<input type=3D\"submit\" value=3D\"SUBMIT\">';
var inputRadio  =3D '<INPUT TYPE=3DRADIO NAME=3D\"MT\" value=3D\"0\" =
>';

var layerRef,styleRef=20
	if (NS6){
	layerRef =3D "document.getElementById('"
	styleRef =3D "').style."
	}
	else{
	layerRef =3D (document.all) ? "" : "document.";
	styleRef =3D (document.all) ? ".style." : ".";
	}

function show(block){
		eval(layerRef + block + styleRef + "visibility =3D 'visible'");
}
function hide(block){
		eval(layerRef + block + styleRef + "visibility =3D 'hidden'");
}


//-->
</script>
</head>
<body topmargin=3D"0" leftmargin=3D"0" marginheight=3D"0" =
marginwidth=3D"0">
<a href=3D"#" onmouseover=3D"javascript:hide('select1')" =
onmouseout=3D"javascript:show('select1')">hide or show select1 =
box</a>&nbsp;&nbsp;&nbsp;
<a href=3D"#" onmouseover=3D"javascript:hide('select2')" =
onmouseout=3D"javascript:show('select2')">hide or show select2 =
box</a>&nbsp;&nbsp;&nbsp;
<a href=3D"#" onmouseover=3D"javascript:hide('select3')" =
onmouseout=3D"javascript:show('select3')">hide or show select3 =
box</a>&nbsp;&nbsp;&nbsp;
<a href=3D"#" onmouseover=3D"javascript:hide('select4')" =
onmouseout=3D"javascript:show('select4')">hide or show select4 =
box</a>&nbsp;&nbsp;&nbsp;<br>
<center>
or all in same time <a href=3D"#" onmouseover=3D"javascript: =
hide('select1'); hide('select2'); hide('select3'); hide('select4')" =
onmouseout=3D"javascript: show('select1'); show('select2'); =
show('select3'); show('select4')">hide or show all</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
the code work cross browser you must all the properties in the style to =
made it work in NS4<br>
as you see under NS6  you must define the layer size properlies =
(ex:select1)<br>
one things I agree the way I display the " or ' it's a bit messy but =
the code work<br>=20
Good luck Laurent Muchacho
<br><br><br><br><br>
you see the box on the left it's working too but it's bit buggy when =
resize on NS4<br>  <a href=3D"#" =
onmouseover=3D"javascript:hide('select5')" =
onmouseout=3D"javascript:show('select5')">hide or show the box on the =
left</a>
</center>


<div id=3D"select1"><table cellpadding=3D"0" cellspacing=3D"0" =
border=3D"0" width=3D"100%">
<tr>
<td>
<script language=3D"JavaScript1.2">
<!--
document.write (openForm);
document.write ('<br>');
document.write (fontSelect);
document.write ('<br>');
document.write (TypeText);
document.write ('<br>');
document.write (inputRadio);
document.write ('<br>');
document.write (typeSubmit);
document.write ('<br>');
document.write (closeForm);
//-->
</script>
</td>
</tr>
</table>
</div>
<div id=3D"select2">
<script language=3D"JavaScript1.2">
<!--
document.write (openForm);
document.write ('<br>');
document.write (fontSelect);
document.write ('<br>');
document.write (TypeText);
document.write ('<br>');
document.write (inputRadio);
document.write ('<br>');
document.write (typeSubmit);
document.write ('<br>');
document.write (closeForm);
//-->
</script>
</div>
<div id=3D"select3">
<script language=3D"JavaScript1.2">
<!--
document.write (openForm);
document.write ('<br>');
document.write (fontSelect);
document.write ('<br>');
document.write (TypeText);
document.write ('<br>');
document.write (inputRadio);
document.write ('<br>');
document.write (typeSubmit);
document.write ('<br>');
document.write (closeForm);
//-->
</script>
</div>
<div id=3D"select4">
<script language=3D"JavaScript1.2">
<!--
document.write (openForm);
document.write ('<br>');
document.write (fontSelect);
document.write ('<br>');
document.write (TypeText);
document.write ('<br>');
document.write (inputRadio);
document.write ('<br>');
document.write (typeSubmit);
document.write ('<br>');
document.write (closeForm);
//-->
</script>
</div>
<div id=3D"select5">
<FORM action=3D"hideSelect.htm" method=3D"get" name=3D"form1"><br>
<SELECT name=3D"dF">
<option value=3D"1">dkfhgkd</option>
<option value=3D"2">dkfhgkd</option>
<option value=3D"3">dkfhgkd</option>
<option value=3D"4">dkfhgkd</option>
<option value=3D"5">dkfhgkd</option>
<select id=3Dselect6 name=3Dselect6>
</form>
</div>
</body>
</html>
------_=_NextPart_000_01C2946E.BDCEB830--