Form Gray Filter

[MC]

Hi,

I have been looking around for a way to apply the filter that grays out a
form or div. I found some examples but the code is pretty complex. Any
simple ways to gray that out so I can highlight another form or div?

Thanks,
Mica
PS. I looked at several of the 'easy' examples and they did not work when I
applied them.

[Peter Michaux]

On May 31, 2:24 pm, "MC" <mica[removethis]@aisus.comwrote :

Hi,

I have been looking around for a way to apply the filter that grays out a
form or div. I found some examples but the code is pretty complex. Any
simple ways to gray that out so I can highlight another form or div?

Thanks,
Mica
PS. I looked at several of the 'easy' examples and they did not work when I
applied them.

Are you looking to disable the form element?

document.forms. gs2.elements.q. disabled = true;
Are you looking to send focus to another element?

document.forms. gs2.elements.so meOtherInput.fo cus();
Are you looking for a visual cue that the input is not longer the
focus or that another one is the focus?

A little longer.

Peter

[MC]

Peter,

For example, I have two forms in a page, if the user clicks a button on
form1, I want to 'gray' or shadow form1 and show form2. I know how do do
everything but gray the form using the alpha filter stuff.

Mica

"Peter Michaux" <pe**********@g mail.comwrote in message
news:d4******** *************** ***********@p39 g2000prm.google groups.com...

On May 31, 2:24 pm, "MC" <mica[removethis]@aisus.comwrote :

>Hi,

I have been looking around for a way to apply the filter that grays out a
form or div. I found some examples but the code is pretty complex. Any
simple ways to gray that out so I can highlight another form or div?

Thanks,
Mica
PS. I looked at several of the 'easy' examples and they did not work when
I
applied them.

Are you looking to disable the form element?

document.forms. gs2.elements.q. disabled = true;
Are you looking to send focus to another element?

document.forms. gs2.elements.so meOtherInput.fo cus();
Are you looking for a visual cue that the input is not longer the
focus or that another one is the focus?

A little longer.

Peter

[Peter Michaux]

On May 31, 2:47 pm, "MC" <mica[removethis]@aisus.comwrote :

[posting order restored. Please don't top post on Usenet.]

"Peter Michaux" <petermich...@g mail.comwrote in message

news:d4******** *************** ***********@p39 g2000prm.google groups.com...

On May 31, 2:24 pm, "MC" <mica[removethis]@aisus.comwrote :

Hi,

I have been looking around for a way to apply the filter that grays out a
form or div. I found some examples but the code is pretty complex. Any
simple ways to gray that out so I can highlight another form or div?

Thanks,
Mica
PS. I looked at several of the 'easy' examples and they did not work when
I
applied them.

Are you looking to disable the form element?

document.forms. gs2.elements.q. disabled = true;

Are you looking to send focus to another element?

document.forms. gs2.elements.so meOtherInput.fo cus();

Are you looking for a visual cue that the input is not longer the
focus or that another one is the focus?

A little longer.

For example, I have two forms in a page, if the user clicks a button on
form1, I want to 'gray' or shadow form1 and show form2. I know how do do
everything but gray the form using the alpha filter stuff.

If it is just the opacity stuff that is the problem then you can
insert a div over top of the form, and size it to match the size of
the form. Give the div an background colour of something like #666.
Then you can set the opacity of that div with a cross-browser
setOpacity function. All the mainstream libraries have such a function
and we are standing precariously at the precipice of yet another
discussion about the quality of these mainstream libraries. Here is a
setOpacity function I wrote quite a while ago, if you want to slice
and dice your own.

http://forkjavascript.org/javascripts/fork/style.js

FORK.Style.setO pacity(overlayD iv, .5)

And the docs I wrote

http://forkjavascript.org/style/docs#setOpacity

You can find quite a bit of setOpacity discussion in the group
archives from the past year. It was the focus of some discussion about
cross-browser scripting in general.

Peter

[MC]

7
"Peter Michaux" <pe**********@g mail.comwrote in message
news:0a******** *************** ***********@q27 g2000prf.google groups.com...

On May 31, 2:47 pm, "MC" <mica[removethis]@aisus.comwrote :

[posting order restored. Please don't top post on Usenet.]

>"Peter Michaux" <petermich...@g mail.comwrote in message

news:d4******* *************** ************@p3 9g2000prm.googl egroups.com...

On May 31, 2:24 pm, "MC" <mica[removethis]@aisus.comwrote :
Hi,

>I have been looking around for a way to apply the filter that grays
out a
form or div. I found some examples but the code is pretty complex. Any
simple ways to gray that out so I can highlight another form or div?

>Thanks,
Mica
PS. I looked at several of the 'easy' examples and they did not work
when
I
applied them.

Are you looking to disable the form element?

document.forms. gs2.elements.q. disabled = true;

Are you looking to send focus to another element?

document.forms. gs2.elements.so meOtherInput.fo cus();

Are you looking for a visual cue that the input is not longer the
focus or that another one is the focus?

A little longer.

>For example, I have two forms in a page, if the user clicks a button on
form1, I want to 'gray' or shadow form1 and show form2. I know how do do
everything but gray the form using the alpha filter stuff.

If it is just the opacity stuff that is the problem then you can
insert a div over top of the form, and size it to match the size of
the form. Give the div an background colour of something like #666.
Then you can set the opacity of that div with a cross-browser
setOpacity function. All the mainstream libraries have such a function
and we are standing precariously at the precipice of yet another
discussion about the quality of these mainstream libraries. Here is a
setOpacity function I wrote quite a while ago, if you want to slice
and dice your own.

http://forkjavascript.org/javascripts/fork/style.js

FORK.Style.setO pacity(overlayD iv, .5)

And the docs I wrote

http://forkjavascript.org/style/docs#setOpacity

You can find quite a bit of setOpacity discussion in the group
archives from the past year. It was the focus of some discussion about
cross-browser scripting in general.

Peter

Peter,

We have a cross browser winner. Every place I looked for this it was buried
deep within many lines of libraries and always tied to other code not
dealing with opacity. I will be using this regularly.

THANK YOU!
Mica

[SAM]

MC a écrit :

>
For example, I have two forms in a page, if the user clicks a button on
form1, I want to 'gray' or shadow form1 and show form2. I know how do do
everything but gray the form using the alpha filter stuff.

<html>
<script type="text/javascript">
function grayer(formId, yesNo) {
var f = document.getEle mentById(formId ), s, opacity;
s = f.style;
opacity = yesNo? '40' : '100';
s.opacity = s.MozOpacity = s.KhtmlOpacity = opacity/100;
s.filter = 'alpha(opacity= '+opacity+')';
for(var i=0; i<f.length; i++) f[i].disabled = yesNo;
}
window.onload=f unction(){graye r('f_2',true);} ;
</script>
<style type="text/css">
form { _height: 1%; /* hack IE */
padding: 10px; background:#ff5 ;
}
</style>
<body>
<form id="f_1" action="#" onsubmit="retur n false;">
<p>test: <input name="test">
<p><button onclick="grayer ('f_2',false);g rayer('f_1',tru e);">
change form</button></p>
</form>
<form id="f_2" action="#" onsubmit="retur n false;">
<p>test: <input name="test">
<p><button onclick="grayer ('f_2',true);gr ayer('f_1',fals e);">
change form</button></p>
</form>
</html>

--
sm