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]

Re: Form Gray Filter

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]

Re: Form Gray Filter

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" <petermichaux@g mail.comwrote in message
news:d4cc3bb4-8e19-4fdc-8796-2d28b4a9996d@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.
>
Peter

[Peter Michaux]

Re: Form Gray Filter

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:d4cc3bb4-8e19-4fdc-8796-2d28b4a9996d@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

[MC]

Re: Form Gray Filter

7
"Peter Michaux" <petermichaux@g mail.comwrote in message
news:0ac4dd5d-5faa-42ec-a680-af4365352c7f@q2 7g2000prf.googl egroups.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:d4cc3bb 4-8e19-4fdc-8796-2d28b4a9996d@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]

Re: Form Gray Filter

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