Why text winces after end of function action in jQuery?

StackOverflow https://stackoverflow.com/questions/13900131

  •  09-12-2021
  •  | 
  •  

Question

I am using jQuery for various animated text effects. In particular I use function fadeIn(). This effect works well. But there is strange behavior at the end of this action. The text winces immediately after the function executes. As if style font-weight changes at the end. But this is not the case and this style is not really used.

Here is my page:

<html>
<head>
<style>
   .fadeInEffect { display: none; }
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
   $(function() {
      $('.fadeInEffect').fadeIn(1000)
    });
</script>
</head>
<body>
   <div class="fadeInEffect">
      My text
   </div>
</body>
<html>

I observed this phenomenon while using other jQuery-functions. How can this be fixed? Any ideas about it?

Was it helpful?

Solution

This is a known artifact of the DX filter used to emulate opacity in Internet Explorer 8 or lower: ClearType is effectively disabled for the duration of the filter's effect.

To my knowledge, there is no workaround. You may want to use another effect on these browsers.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top