Click here to Skip to main content
Licence CPOL
First Posted 5 Jul 2006
Views 12,205
Bookmarked 16 times

An ASP.NET / HTML dimmer for your website

By | 5 Jul 2006 | Article
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, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

pogowolf

Web Developer

United States United States

Member



Sign Up to vote   Poor Excellent
Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

 
You must Sign In to use this message board. (secure sign-in)
 
Search this forum  
 FAQ
    Noise  Layout  Per page   
  Refresh
-- There are no messages in this forum --
Permalink | Advertise | Privacy | Mobile
Web04 | 2.5.120517.1 | Last Updated 5 Jul 2006
Article Copyright 2006 by pogowolf
Everything else Copyright © CodeProject, 1999-2012
Terms of Use
Layout: fixed | fluid