changing opacity is making text bold in ie

or bigger not sure

[icpooreman]

I've got a function that fades text in and out but as soon as it gets to this line of code it makes the text bold or bigger in ie and I can't figure out why.

document.getElementById("newsheader").style.filter="alpha(opacity=100)";

newsheader is the id on a div that contains the text I'm changing.

I've actually went in and made this the only line to be executed and it's definitely the cause of my problems. Is the max opacity not originally 100 that's the only thing I can think of as to why it does this.

[icpooreman]

well I haven't found the solution I was looking for but I did find that if in my css file I set newsheader's opacity to 100 it starts out bold. This means that the original opacity of my elements aren't 100% if my logic is right that's why making it 100% is changing the text to bold. Which doesn't make any sense really because shouldn't the default value be 100%.

[icpooreman]

Actually I haven't found a solution at all I tried starting the opacity at 50 going to 0 then back to 50 and that just makes my text half visible and bold.

[kaled]

Just a guess. Are you using XP with clear-type font smoothing? If yes, try switching it off.

Kaled.

[icpooreman]

Actually I wasn't using that but I turned it on to see what happened and the effect was much more noticeable. So you may have been on the right track. I think it might be the cpu's font settings and if that's the case there's really no way to fix it so I think I'm just going raise the white flag on this one and not change the opacity on my page.

[sersun]

For IE, you MUST set a background and a width for this to work - then it's no problem :-)

Thanks to seanpowell for finding this.