Question

I have added text animation using javascript function:

<div id="stats">
    <div class="textEffects">    
    Text 1 <br />    
    Text 2  
    </div>    
</div>

<script type="text/javascript">
    function loop_font() {
        $('.textEffects').animate({ fontSize: "1.2em" }, 400, function () {
            $('.textEffects').animate({ fontSize: "1em" }, 400, loop_font);
        }); 
    }

    loop_font();

</script>

Animation works just fine but there is problem with IE (i am using IE 8) – when animation is starting css style margin-left is decreased from 120 to 0. This margin is one of styles of text container (#stats) wchich is not even part of this animation.

Do you have any idea what to do to have both animation and all styles right?

Answer 1

I added style

.textEffects
{
    position: absolute;
}

and it worked.