Replies to This Discussion

Permalink Reply by JenSocial on September 8, 2010 at 6:26pm

Opacity gets really tricky, especially across browsers. I typically create an image that has opacity value, and use the image as background, with the color set to transparent. That gives you the best results across all browsers.

To do this via CSS, here's a start, and how to add opacity to the center main body of your network:
#xg_body {background-color:#ffffff;
border:1px solid black;
/* for IE */
filter:alpha(opacity=60);
/* CSS3 standard */
opacity:0.6;
}

OOPS, that won't work. On a Ning it will make everything on the xg_body have the opacity setting too. I'll look again later. Sorry, about to run out door for a while.
Best,
Jen

• ▶ Reply

Permalink Reply by james on September 8, 2010 at 10:03pm

Thanks Jen, I'll try your first option

• ▶ Reply

Permalink Reply by JenSocial on September 8, 2010 at 10:14pm

Hey James, To be honest, I'm not the best at this. And the reason is because transparency and opacity drive my eyes crazy. I can guarantee you that the theme site called
ThemeWorx will have many Experts at this. They most always design the member profile page themes with tons of transparency and opacity effects. The code below is an example of how I simulate a more solid approach to opacity. I create the effect using an image. For this example, all I did was create an image 20 pixels square in Photoshop, and made the fill color a gray, with 20% transparency for the layer. This code will change all of the backgrounds behind your main content to transparent. Then it will overlay the gray image that has 20% transparency over the transparent backgrounds. #xg,#xg_body {background-color:transparent!important;} .xg_module_body, .xg_module_foot { background-color:transparent!important;background:url("http://storage.ning.com/topology/rest/1.0/file/get/981288935?profile=original") repeat scroll 0 0 transparent; margin:0; } If for some reason the URL for the transparent image doesn't work, I'll insert the file link too. I see this happen from time to time in the comment boxes, with Ning's long image paths.
gray20transparency.png Good luck, and have fun! Jen P.S. Seems I noticed the question on Creator site too? I'll post answer there as well, for other folks too.

• ▶ Reply