Create two semi-transparent images that when stacked produce the target image

Posted by posfan12 on Stack Overflow See other posts from Stack Overflow or by posfan12
Published on 2010-05-05T11:55:42Z Indexed on 2010/05/05 11:58 UTC
Read the original article Hit count: 269

Filed under:

css

|

alpha

|

channel

|

gimp

|

alphablending

Due to CSS limitations I am forced to stack to semi-transparent images on my website. I won't go into detail regarding the CSS since if I can get this question answered the problem is moot.

Anyway, I would like to modify image A in the GIMP such that it will look like it did originally after being stacked on top of image B. Both image A and image B have their opacities set to 50%. Image B is a solid color throughout, whereas image A has some minor details such as a gradient.

Here's what it looks like before image B is applied on top (and what it should look like in the end):

[URL=http://s421.photobucket.com/albums/pp292/SharkD2161/Support/Website/?action=view&current=website_testing_target_image.png][IMG]http://i421.photobucket.com/albums/pp292/SharkD2161/Support/Website/th_website_testing_target_image.png[/IMG][/URL]

Here's what it looks like after image B has been applied on top:

[URL=http://s421.photobucket.com/albums/pp292/SharkD2161/Support/Website/?action=view&current=website_testing_undesired_result.png][IMG]http://i421.photobucket.com/albums/pp292/SharkD2161/Support/Website/th_website_testing_undesired_result.png[/IMG][/URL]

Thanks!

Mike

© Stack Overflow or respective owner

Related posts about css

HTMLUNIT Facebook javascript warning

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi I am trying to create simple application that would be able to search people on facebook using given e-mail. I am already able to log into an account using the HTMLunit tool and even create a page, which should throw result of my search. But when I try to print the result as XML the file is missing… >>> More
$this->headLink() includes duplicated script

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, Just like I did before, I used the following code for my new project. <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/button.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/inputText.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/fancyTable… >>> More
How much multiple style sheets slow down to website?

as seen on Stack Overflow - Search for 'Stack Overflow'
Here is 3 css file (one is only for IE) <link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection"> <link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print"> <!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie… >>> More
mod_pagespeed is rewriting but not combining

as seen on Stack Overflow - Search for 'Stack Overflow'
I have the following problem. I installed mod_pagespeed but i am not getting the results i want! It does rewrite my css and changes the to the cache url but its not combining the css files. I have seached the web and stackoverflow for it but did not find a solution. Here are the tags <link… >>> More
CSS import or multiple CSS files

as seen on Stack Overflow - Search for 'Stack Overflow'
I originally wanted to include a .css in my HTML doc that loads multiple other .css files in order to divide up some chunks of code for development purposes. I have created a test page: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional… >>> More

Related posts about alpha

Convert a gray PNG with alpha to a 1-bit black rectanble with 8-bit alpha

as seen on Super User - Search for 'Super User'
I use a tool to render LaTeX equations as PNG. The resulting images are in RGBA8888 format. I would like to extract the luminance (grayscale from RGB channels, multiplied by the A channel) as my new alpha channel, set the picture fully black, and save the result in Gray1Alpha8 (G1A8) format. So far… >>> More
When is a webapp called Beta, alpha, pre-alpha, or none

as seen on Stack Overflow - Search for 'Stack Overflow'
I've come across many apps on the web that call themselves Beta. I've come across other apps that had an alpha designation. I've even come across some that called themselves pre-alpha, whatever that means (if you know please clarify). Then I've come across some really bad webapps that shouldn't have… >>> More
Flex: Create custom stroke on LineSeries?

as seen on Stack Overflow - Search for 'Stack Overflow'
You can easily set a stroke on a line series like this: <mx:LineSeries yField="apple"> <mx:lineStroke> <mx:Stroke color="0x6699FF" weight="4" alpha=".8" /> </mx:lineStroke> </mx:LineSeries> This… >>> More
The Direction Of Intel Graphics With Fedora 13 Alpha

as seen on Internet.com - Search for 'Internet.com'
<b>Phoronix:</b> "...each Fedora release always pulls in the very latest Linux graphics code. Fedora was the first distribution shipping with the Nouveau driver, then its KMS driver, and now with Fedora 13 it's the first OS deploying Nouveau's Gallium3D driver..." >>> More
Fedora 13 Alpha released

as seen on Internet.com - Search for 'Internet.com'
<b>Test-Announce:</b> " The Fedora 13 "Goddard" Alpha release is available! What's next for the free operating system that shows off the best new technology of tomorrow? You can see the future now..." >>> More