Have an idea?

Visit Sawtooth Software Feedback to share your ideas on how we can improve our products.

tooltip bg color is transparent

I have added tooltip function in v8 and also modified bg color in CSS. I am getting tooltip. However, the background color is transparent. Any ideas?

.tool_tip_text
{
    font-size: 12px;
    width: 200px;
    height: 60px;
    border: 1px solid #7F7F7F;
    background-color: #33DDCC;
    padding: 4px;
    position: absolute;
    z-index: 1000;
    display: none;
}
asked Jul 12, 2012 by Lawrence Bronze (2,100 points)
retagged Sep 13, 2012 by Walter Williams

1 Answer

0 votes
Try using the opacity: tag. The default is likely set to .06, so give it a try at opacity:.1; or more depending on whether you want it to be at all transparent or not.
Hope this works!
answered Jul 12, 2012 by amc Bronze (745 points)
Great! It worked.
I am curious, which opacity level did you choose? Is transparency not your preferred choice for the tooltip?
I have opacity level as .1
The transparency is confusing while reading tooltip text.
Font color: Again, the tooltip gives different font color when I have the tooltip for Levels in the conjoint excercise. For attributes, I get regular color for font.

bgcolor: Also in my code I am using a different color than the native color for background. It is not taking the color value and still showing the native color on the background.

.tool_tip_text
{
    font-size: 12px;
    width: 200px;
    height: 60px;
    border: 1px solid #7F7F7F;
    background-color: #33DDCC;
    padding: 4px;
    position: absolute;
    z-index: 1000;
    display: none;
    opacity: .1;
}
Are you hoping to make the font color black? color: #000000; (black) could be your solution.
I don't quite understand what bg color you are trying to get. Try using background: #33DDCC;

Let me know if these work for you

If not, try using the bgcolor: and textcolor: tags
Actually i want to change the bg color for tooltip.

The below code shows the native color under "ssi_style8_0_2.css"  In this I am trying to use "background-color: #33DDCC;" to have a new bg color for tooltip. But it is not at all accepting. I also tried bgcolor or textcolor tags and no use.

.tool_tip_text
{
    font-size: 12px;
    width: 200px;
    height: 60px;
    border: 1px solid #7F7F7F;
    background-color: #E6E6E6; /*native color*/
    padding: 4px;
    position: absolute;
    z-index: 1000;
    display: none;
}
Here is easy SSI script form [%ToolTip("Text to be moused over", "tooltip reader", 200, 60)%] that will give you a gray background and text in size 10 Arial font.

As far as your code goes, try -- bodyStyle: 'background-color: #33DDCC;'
I am taking a stab in the dark, as I have never tried to do this before.
It seems as though your code should work. Have you defined the .tool_tip_text class? Perhaps you should try "tool_tip_text," without the (.) but that depends on your HTML code
...