Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

An ASP.NET / HTML dimmer for your website

0.00/5 (No votes)
5 Jul 2006 1  
Ever wanted to dim the background of an HTML page, and the only code you can find is all based off IE's CSS Filters? I wanted to make a cross-browser solution to this (and go easy on me.. this is my first post.. he he).

Introduction

Ever wanted to dim the background of an HTML page, and the only code you can find is all based off IE's CSS Filters? I wanted to make a cross-browser solution to this (and go easy on me.. this is my first post.. he he).

Setup

First, you'll need to make sure the body of the HTML can be 'seen' by the code. We do this by adding an ID to the body tag:

<body id="ReportBody" MS_POSITIONING="GridLayout" runat="server">

Now we need to make a GIF. The Gradient.GIF is nothing more than a 4x4 pixel with an alternating transparent pixel and a color pixel. Normally, I use light gray for the color pixels.

Code

There's two ways to change the background. If your class has the form in focus, you can just call the style change directly with something like this:

myBody.Style.Add("background-image", "url(images/gradient.gif)")

If you want to turn off the gradient, then just replace the background with what ever you had set before.

This example just turns off the background image, defaulting the page back to the default background color.

myBody.Style.Add("background-image", "")

Expansion

You could expand on this simple code to perform some really cool 'tricks'. Some ideas would be to dim the background and then create a floating DIV to allow for data entry or information.

How about popping up a process bar while the site is grabbing information off a database?

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here