chnage color on the fly

[ralphtrent]

Hello
I have three images that make up a "set". The set contains a header, middle, and footer. I would like to have the color of the image be decided by my users. The images are just flat colors with curved edges on the top for the header, and bottom for the footer. Right now I have hard-coded the images with certain colors. Is there a way to have the image change colors on the fly, or do I need to predefine the images?

Thanks
Ralph

 

[dwarfthrower]

You'll need to predefine the images. Although you may be able to do some (IE ONLY) basic color filtering using IE filters.

_{Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.}

 

[clarkin]

You could make some images with transparant 'blocks' - then set a background color behind them and change this on the fly. Quite easy to do, and you only need one set of images.

Posting code? Wrap it with code tags: [ignore]

[/ignore][code]CodeHere

[ignore][/code][/ignore].

 

[dwarfthrower]

↑ Much better idea.

_{Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.}

 

[ralphtrent]

clarkin, how would I do that? I made the images transparent in PS, and then change the bgcolor of the td cell, but this will not work because the curved edges go away. I think i misunderstood what you meant. Please let me know.

 

[ChrisHunt]

Here's what I would do (and I think it's what clarkin meant too). Assuming your page background is a fixed colour; you make an image for the top and bottom of your "set" which are mostly transparent but have the areas outside the rounded corners filled in with the page backgroung colour (i.e. the exact opposite of what you've probably already got).

You can then arrange these in a table, set of <div>s, or whatever; setting the table's background to the colour you want.

-- Chris Hunt

http://www.extracon.com

http://www.mcgonagall-online.org.uk

http://www.napitalia.org.uk

http://www.leicesteryha.org.uk

 

[clarkin]

Have a look at this link:

http://www.simplebits.com/archives/2003/07/#000041

Those four 'i' images are all the same, but with different coloured backgrounds. It is simple to change the background colors on the fly.

Is that what you are after?

Posting code? Wrap it with code tags: [ignore]

[/ignore][code]CodeHere

[ignore][/code][/ignore].

 

[ralphtrent]

Yes, pretty much.

 

[clarkin]

While you're looking at transparent images check out .png graphics format.. it supports multiple levels of transparency. Have a look here:

http://www.w3.org/Graphics/PNG/inline-alpha.html

Check it with IE 6 (supports png, but not alpha transparency) and something like NN7 or Firebird 0.7

It will certainly mean less work for image makers once this is supported across the board.

Posting code? Wrap it with code tags: [ignore]

[/ignore][code]CodeHere

[ignore][/code][/ignore].