Netshine Software Limited







Home arrow Developer Blog Make Text BiggerMake Text SmallerReset Text Size

Aug 10
2009

Background always transparent in OverLib

Posted by netshine in transparenttooltipstemplateOverLibjoomla 1.5joomlaJavascriptcsscolourcolorbackground

I just spent an infuriating hour trying to work out why the tooltips output by nBill, using OverLib, were always coming out with a transparent background - even if I explicitly specified a background colour when calling OverLib. I tried sending commands in the call to OverLib and setting the javascript variable, but the commands were just ignored.

It seems the solution lies in your template's CSS file...

Thanks to this forum post: http://forum.joomla.org/viewtopic.php?f=541&t=306259, I was able to fix the problem on my template by adding the following to the CSS file:

.ol-foreground
{
    background-color: #EEF3FF;
    border: solid 1px #215DC6;
    padding: 5px;
}

Naturally, you will need to adjust the colour values to suit your template.



Comments (8)Add Comment
Above coding didn't work on my templete
written by Mr. Sumon, September 19, 2009
Hello dear,
Thanks for the above suggestions, however it worked only on JA_Purity template but not in mine one. Could you please go here: http://clippingpathindia.com/c...rder&cid=3

When you are not logged in the help text is fine but once I login the text shows on a transparent background which is sometime very hard to read. Do you have any idea how I could fix the issue, I contacted the developer of the above template but he said I should contact nBill module developer for this. Its a very important issue for me that I need to fix asap.

Any suggestions will be appreciated.

Thank you very much.
report abuse
vote down
vote up
Votes: +0
...
written by netshine, September 19, 2009
Did you try using the full code from that forum post I linked to? ie:

.ol-foreground {
background-color: #f6f6f6;
}

.ol-background {
background-color: #666;
}

.ol-textfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}

.ol-captionfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #f6f6f6;
font-weight: bold;
}
.ol-captionfont a {
color: #0B55C4;
text-decoration: none;
font-size: 12px;
}

.ol-closefont {}
report abuse
vote down
vote up
Votes: +0
...
written by Mr. Sumon, September 21, 2009
Yes, sir. I tried coping full code as well but there was no result. I also copied into both template css file and nbill css file.

Thank you very much for your continuos trying..
report abuse
vote down
vote up
Votes: +1
...
written by netshine, September 21, 2009
I just looked at the CSS file for the page you referred to, and the above rules are not in it. The code needs to be added to this file: http://clippingpathindia.com/t...e_css.css. The nBill CSS file is only for invoices - it will have no effect on any pages in your website.
report abuse
vote down
vote up
Votes: +0
...
written by Mr. Sumon, September 21, 2009
Sorry about that, I actually added them before and again deleted since it didn't work, however I have now added them again. I added the code at the end of css file. I would be grateful if you could check it now.

Please let me know if I could do anything else.

Thanks.
report abuse
vote down
vote up
Votes: +0
...
written by netshine, September 21, 2009
You have a syntax error in your CSS file - a missing closing bracket on the .answer class (at the end of the file, just before the overlib classes). If you put the closing bracket there so that the CSS validates, it works fine.
report abuse
vote down
vote up
Votes: +0
...
written by Mr. Sumon, September 21, 2009
What can I say sir, You are so kindly and helpful. I know it wasn't an issue from your side, it was my mistake in the css file but you went to details and solve the issue. It is now perfect. Thank you so much for all your help. I really appreciate.

Mr. Sumon
report abuse
vote down
vote up
Votes: +0
Hey! This is what I was looking for!
written by Luis Martin, February 04, 2010
Thanks for your advice mate! I was just looking for the same answer, because in my case the overLIB pop-ups in a Joomla extension appeared with transparent background too. Just fixed it.
Cheers!! smilies/wink.gif smilies/smiley.gif
report abuse
vote down
vote up
Votes: +1

Write comment
quote
bold
italicize
underline
strike
url
image
quote
quote
smile
wink
laugh
grin
angry
sad
shocked
cool
tongue
kiss
cry
smaller | bigger

security code
Write the displayed characters


busy
Joomla! Tutorial
Take a look at our free tutorial for Joomla! Administrator...


Login Form





Lost Password?

© 2004-2010 Netshine Software Limited   Terms and Conditions