Javascript 如何修复IE中动画后的移位

Javascript 如何修复IE中动画后的移位,javascript,jquery,internet-explorer,animation,Javascript,Jquery,Internet Explorer,Animation,我刚刚制作了一个文本动画(淡入;动画(顶部,不透明度)),最后,文本向左移动了大约5px,然后很快返回到其原始位置。这只发生在IE中;所有其他主要浏览器都表现正常 你知道它为什么会发生,以及如何修复吗?我对修复IE7特别感兴趣 谢谢 (顺便说一句,我删除了filter属性以避免ClearType故障。) HTML <div id="logomarca"> <h1 id="marca">txt</h1> <p id="spec">tx

我刚刚制作了一个文本动画(淡入;动画(顶部,不透明度)),最后,文本向左移动了大约5px,然后很快返回到其原始位置。这只发生在IE中;所有其他主要浏览器都表现正常

你知道它为什么会发生,以及如何修复吗?我对修复IE7特别感兴趣

谢谢

(顺便说一句,我删除了filter属性以避免ClearType故障。)

HTML

<div id="logomarca">
    <h1 id="marca">txt</h1>
    <p id="spec">txt</p>
</div>
Javascript

    $(document).ready(function(){
    $("div#logomarca").show();
    $("p#spec").fadeTo(0, 0.00,
        function() { if($.browser.msie) { this.style.removeAttribute('filter'); }; } 
    ); //hide() is not working with fadeIn
    if($.browser.msie) { 
                $("p#spec").css({ 
                "margin-top": "8px",  
                "margin-left": "-165px", 
                display: "none"  
                }); 
            };  
    $("div#logomarca").animate({
        top: "+=50%",
        opacity: 1.00
        }, 2500, 
        function() { if($.browser.msie) { this.style.removeAttribute('filter'); }; } 
        );
    $(this).delay(3200,function(){  
        if($.browser.msie) { $("p#spec").show(); };
$("p#spec").fadeTo(0, 0.00  ); 
        $("p#spec").animate({
            opacity: 1.00,
            top: "+=20"     
            }, 2500,
            function() { if($.browser.msie) { 
                this.style.removeAttribute('filter'); 
                }; }            
            );
        $(this).delay(3500,function(){  
            $("p#spec").fadeTo(800, 0.0);
            $(this).delay(650,function(){  
                $("h1#marca").fadeTo(1500, 0.0);
                });
            });
        });
 });

尝试用固定尺寸的div包装。

如果您可以发布一个最小化的工作示例,这样我们就可以查看代码了


我的最佳猜测是,您需要使用块级元素(
div
p
)包装您的元素,并为该元素指定“
位置:相对您能生成一个测试用例吗?换句话说,显示问题的工作代码是什么?另外,IE6、IE7或两者都有问题吗?如果你问一个关于IE的问题,了解你所说的是什么版本会很有帮助,特别是对于JS和CSS问题。当然。。。很抱歉。是IE7。我决定不再使用IE6,因为我无法用您提供的示例重现该错误。Opera、Firefox和IE都可以正常工作(除了IE有一个不相关的bug,它从不同的位置开始)。位置没有问题,这很容易修复,但无法理解为什么它不同。。。在这里,它可以与Fx、Opera、webkits配合使用,但IE7在动画结束时仍在“摇晃”p#spec内容,就在淡出之前。这很难看到,但足以引起客户的抱怨:(已经是这样了:txt

txt

div,p{position:absolute;}它发生在以下动画之后:$(“p#spec”).animate({opacity:1.00,top:+=20“},2500,和过滤器移除};(很抱歉,格式太差了,这里没有空间了)@satinka,你真的应该在你原来的问题中添加你的代码。我已经尽了最大的努力。
    $(document).ready(function(){
    $("div#logomarca").show();
    $("p#spec").fadeTo(0, 0.00,
        function() { if($.browser.msie) { this.style.removeAttribute('filter'); }; } 
    ); //hide() is not working with fadeIn
    if($.browser.msie) { 
                $("p#spec").css({ 
                "margin-top": "8px",  
                "margin-left": "-165px", 
                display: "none"  
                }); 
            };  
    $("div#logomarca").animate({
        top: "+=50%",
        opacity: 1.00
        }, 2500, 
        function() { if($.browser.msie) { this.style.removeAttribute('filter'); }; } 
        );
    $(this).delay(3200,function(){  
        if($.browser.msie) { $("p#spec").show(); };
$("p#spec").fadeTo(0, 0.00  ); 
        $("p#spec").animate({
            opacity: 1.00,
            top: "+=20"     
            }, 2500,
            function() { if($.browser.msie) { 
                this.style.removeAttribute('filter'); 
                }; }            
            );
        $(this).delay(3500,function(){  
            $("p#spec").fadeTo(800, 0.0);
            $(this).delay(650,function(){  
                $("h1#marca").fadeTo(1500, 0.0);
                });
            });
        });
 });