Question

Need a div to partially show the image behind it, is this even possible? Tried:

opacity:.5;

AND

filter:alpha(opacity=50);

Both produce a solid div.

Any help would be much appreciated.

Was it helpful?

Solution

From a wondrous pure guess in a comment, I managed to find a working answer:

Did you try using a semi-transparent .png?

Yay!

OTHER TIPS

Right you are, thirtydot! You gotta toss a thumbs-up for cfdocument, eh?

I've confirmed this works in CF9. I do wonder whether this example is backward compatible.
Can anyone confirm other ColdFusion versions support this?

<cfdocument format="PDF" pagetype="letter" 
    margintop="0.5" marginbottom="0.5" 
    marginleft="0.5" marginright="0.5">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <style type="text/css">
    body { background-image: url( "images/use_your_image.jpg" ); }

    img { border: 3px solid #990000; }
    </style>
</head>
<body>
    Does transparent image appear above the background repeated image?
    <img src="images/red_transparent_100x100.png">
    <!--- Generated this at http://transparent-png-generator.com/ --->
</body>
</html>

</cfdocument>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top