View Full Version : Animated Collapse losing font-weight?

02-09-2009, 10:45 PM
1) Script Title: Animated Collapsible DIV v2.01

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

3) Describe problem:

I created this simple test page to show the issue I am having:


Basically, it seems like the font-weight is lost after toggling a div with the animated collapse script in IE 7. It could be something else other than the font-weight, but the font definitely changes.

Any insight? Am I doing something wrong with my css or am I doing something incorrect with the script?

02-10-2009, 05:32 AM
I believe you're talking about in IE right (and not FF)? This is due to a bug in IE's clear-type font rendering in combination with changing the opacity of an element that contains text. This post (http://jszen.blogspot.com/2005/04/ie-bold-text-opacity-problem.html) on the web might help.

02-10-2009, 06:08 AM
I am talking about IE but unfortunately the fix on that site did not help. I also tried some of the fixes mentioned in the comments section but none of them worked either.

Thanks for the suggestion though, it looked promising.

02-10-2009, 05:23 PM
While the suggestion of adding a background-color as in the linked article did not fix the problem I think the article is definitely about the issue I am seeing. If I remove fade=1 from the addDiv call so that the opacity is not messed with by the script then the bug does not happen.

So for now I have a workaround.


02-10-2009, 06:49 PM
Well disabling the fade effect inside the script certainly will make it no longer an issue. Anyhow, you may want to do a search on the forums for the clear type font issue- there are quite a few threads on this I believe (relating to other scripts as well that manipulate opacity). To be honest I haven't really researched the topic all that much myself.