How to grey out the background?

light2006 · **How to grey out the background? -** 01-17-2007

I know nothing about Ajax, but I'm eager to learn it.

I'm interested to know how to grey out a background, I see it happen when I click on "Log Out" on this site.

Is greying out done with Ajax? It's a pretty cool effect.

RS Tom · 06:41 PM

Nope, no AJAX. It's straight DHTML and uses IE's image libraries.

You can read up at IE Filters and Transitions

Code:

function log_out()
{
 ht = document.getElementsByTagName("html");
 ht[0].style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)";
 if (confirm('Are you sure you want to log out?'))
 {
  return true;
 }
 else
 {
  ht[0].style.filter = "";
  return false;
 }
}

You just do the following to use:

Code:

<a href=http://www.revenuesource.com/ onclick="return log_out();">Log Out</a>

The function is called when the link is clicked. It grays out the screen and asks if the user wants to log out. If they click yes, true is returned and the browser visits the href location. If they click no, false is returned and the link doesn't do anything.

AJAX is a different technology that is used to retrieve off-page information without reloading the HTML page. For example, I could have a dropdown that has a country selection. When the person chooses their country, I fire off an AJAX request and it returns a list of provinces/states for the next dropdown box. I can also check username/password availablity using AJAX when someone is filling out a form.

light2006 · **Re: How to grey out the background? -** 01-20-2007

Thank you for the comprehensive explaination.

From reading the code, it looks like that transition filter is really browser dependent.

I tried it on Firefox, and it didn't work.

I remember IE also has a styling feature for the scroll bar, which only works on IE.

Usually W3C catches up with Microsoft and implements those features. I hope W3C does it probably in CSS3.0 or CSS4.0 so that those features can be implemented with ease on all browsers.

Because, there is an increasing number of people using Firefox, as shown by a small sample of my visitor stats in the attachment.

pakistanboy · **Re: How to grey out the background? -** 08-31-2007

I do not have any idea of AJAX but if you give me your code i would check then i can suggest you about the grey background.

amanda123 · **Re: How to grey out the background? -** 10-30-2007

Well i can supose that how cute effect is that .
I have worked a bit in Ajax but seriously dont have any idea about the background settings.