Current status of the Ning Platform is always available on the Ning Status Blog.

Forum

Semi Transparent Module Body

Hello, 

I have read various discussions about adding a semi-transparent background to the body of a site while allowing the text and other content to still be fully visible, but I can't get it to work on my site. 

I have added opacity css to the .xg_theme #xg_body and it makes the whole page semi transparent 

I added the same code to the .xg_theme .xg_module and it makes the whole module and content within it transparent. 

Please advise on how to create a semi transparent black background for my page that allows the content in the modules to still be fully visible. Similar to this site -  http://themeforest.net/item/clubber-events-music-wordpress-theme/full_screen_preview/3427687 

Your help would be very appreciated! 

Thanks! 

My site is still under construction - www.midwestmusik.com 

You need to be a member of Ning Creators Network to add comments!

Join Ning Creators Network

Email me when people reply –

Replies

  • Try to set this instead:

    #xg.xg_widget_main.xg_widget_main_index.xg_widget_main_index_index

  • have you tried #xg_body {

    im almost doing that right now.... http://yubasutterconnect.com

  • Hey everyone thanks for your examples - I tried them all - what I ended up doing is using Photo shop to create an image that appears transparent by having the background layer source be the image I use in my website background then add another layer, a black (or any color you want) layer on top set to .3 opacity so that you see the background through it. When you save it as a png and upload it as the image for the main content, setting the modules to transparent - the background has a black shade over the background giving it the semi-transparent look I wanted. Thanks for your help! 

    • that is exactly the approach I've used recently:

  • Check out our site > http://uk-christians.net

    We've made the modules' backgrounds semi-transparent by using an Adobe Fireworks image

  • The way it should be done is using a RGBA color code with the occupancy added at the end. To make the color more pronounced or more transparent just raise or lower the number 0.43 at the end of the code. Here's the code.

    #xg_body{
     background-color: rgba(000, 000, 000, 0.43)!important;}

    • Thanks George, I'll try this out.

      • You're welcome Alexander
        If you want it just for the modules Like on your site here's the code for that. :-)
        .xg_module{
            background-color: rgba(000, 000, 000, 0.43)!important;}

        • Thanks again.. I'll try them out tomorrow..!

This reply was deleted.

Search the Creators Network

Latest Activity

Mary Jane Peterson replied to John Bizley's discussion Something Interesting has popped up regarding videos and Ning..
"We don't have videos yet :("
8 minutes ago
Vincent Granville replied to Ofelia B.G.'s discussion Error 500
"Yes, two of my Ning networks (one with 40,000 members) experience this for hours pretty much twice…"
21 minutes ago
John Bizley replied to Mary Jane Peterson's discussion Activity Box
"You need to add to your homepage, go to your site & pages then click on your homepage in the list,…"
40 minutes ago
Kos replied to Ofelia B.G.'s discussion Error 500
"Yes, intermittently on 2.0 (not on 3.0)  Ning needs to fix that server........."
1 hour ago
Shelly Begarowicz replied to George H. Compton IV's discussion A tip all Ning3 networks can benefit from. "fluid YouTube & Vimeo Videos"
"For all us CODE CHALLENGED individuals.  This code makes the videos resize themselves according to…"
2 hours ago
o.d. brooks replied to Ofelia B.G.'s discussion Error 500
"The Error 500 message has been happening on and off for the past month or two on the Ning 2 network…"
2 hours ago
soaringeagle replied to Brandon Owens's discussion 3 essential back-end changes that Ning could make to increase Everyone's traffic
"haha yea true and jamroom guys are just absolutely amazing and give u absolutely everthing u ask fo…"
3 hours ago
Strumelia replied to Brandon Owens's discussion 3 essential back-end changes that Ning could make to increase Everyone's traffic
"This thread with suggestions is almost three years old now.  You guys keep on dreamin' that happy d…"
3 hours ago
soaringeagle replied to Brandon Owens's discussion 3 essential back-end changes that Ning could make to increase Everyone's traffic
"you know i8t took me a year to get them to fix the meta description tags so it didnrt  inckude the…"
4 hours ago
soaringeagle replied to Brandon Owens's discussion 3 essential back-end changes that Ning could make to increase Everyone's traffic
"u know nings never going to bother
im moving to jamroom (wich is freaking awesome)
they already hav…"
4 hours ago
George H. Compton IV replied to George H. Compton IV's discussion A tip all Ning3 networks can benefit from. "fluid YouTube & Vimeo Videos"
"Thank you Fire-Tech :-)"
5 hours ago
George H. Compton IV replied to George H. Compton IV's discussion A Christmas gift for all Christian/Religious networks, A Dramatized audio Bible!!!
"Thank you Jim, blessings.."
5 hours ago
Nawal Kumar and Rob Nanya joined Ning Creators Network
5 hours ago
John Bizley replied to Zachary Moonshine's discussion How to center page on ning 3 ?
"Yes, in the design studio my header is set to scroll as default then on screens above 1024px it is…"
5 hours ago
Danilo Junqueira replied to Evandro Dalben's discussion Alguem mais esta com problemas com o NING 3.0 in Criadores Brasileiros - Brazilian Creators
"Eu também estou tendo problema..
E acho que está indo pro saco mesmo."
6 hours ago
George H. Compton IV replied to Zachary Moonshine's discussion How to center page on ning 3 ?
"Okay Zachary, keep using that code but add this code to the bottom of your design studio. Your head…"
8 hours ago
Zachary Moonshine replied to Zachary Moonshine's discussion How to center page on ning 3 ?
"wow john so the menu stays fixed on big screens but on small ones it scrolls? "
13 hours ago
Zachary Moonshine replied to Zachary Moonshine's discussion How to center page on ning 3 ?
"I like the menu being left on the side and the main body and content is centered the code i ended u…"
13 hours ago
FedMedic replied to Lora's discussion HELP! Non Member Showing up on activity feed!
"Greetings Lora, I don't think this is as nefarious as you think. :) Here's a question, did you or o…"
18 hours ago
George H. Compton IV replied to Zachary Moonshine's discussion How to center page on ning 3 ?
"Zachary, I adjusted the code that you wanted for your network. See image below. :-)Remove the code…"
20 hours ago
More…