Jump to content

Archived

This topic is now archived and is closed to further replies.

sheilahoff

Transparent RevSlider background?

Recommended Posts

sheilahoff

I'm pulling my hair out trying to make this work. I have made a png with text on it and a transparent background in Photoshop. I know it's transparent. But RevSlider still puts a white box behind it. :-(

 

I've been trying every CSS trick I can find to no avail. I have even tried making the whole page transparent which I do not want as we will have text below the slider that needs to be on white (or at least 50% transparent). In fact I'd probably be OK making the entire homepage 50% but we want the internal pages to remain white for the text.

 

Dev site playground for this is at www.karen.hoffmangraphics.com. I've removed all but one slide so it doesn't move. And added a text box below for comparison.

 

I've tried so many permutations of CSS I'm loosing track. Here are a few...

 

.home #page-main {background: none;}
}

 

I've tried this for the rev slider which has the class slotholder

 

.slotholder: {background-color: rgba(255,255,255, 0);}

OR

.slotholder: {background: none;}

 

I've even tried

#pl_areau7q66v .content { background: transparent; }

 

How can we achieve the desired result?

Thank you!

 

Sheila

 

PS: I've used a single media image in the header to show the client what COULD look like IF I ever get the CSS right. You can see what I'm after here: http://testing.hoffmangraphics.com/ But of course we do NOT want it in the header, we  want it only on the homepage not throughout the site. As soon as I drop it into the body I lose the transparency still. I hope someone can help me achieve this! At this point I'd be happy to make just a single image work instead of the slider.


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites
sheilahoff

Update...I would still love to know how to do this for the future. It's not the first time I'm wanted to do it. BUT...this client has changed her mind and we now have a look that does not require this information. Thanks.


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites
James B

Hi Shelia

 

The white bg is coming from the #dynamic content div, not the slider. Checkout - http://screencast.com/t/xkqu0R9eWAsr

 

The css below will resolve

 

#dynamic-content {
    background: none;
}

Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
sheilahoff

Thanks James. I'd actually tried that already and it doesn't seem to work when added to the CSS. Not sure why. But thankfully I don't need to make this work (this time!). I'll save that code just in case though. Thanks.


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites

×