0

我刚刚制作了一个文本动画（淡入；动画（顶部，不透明度）），最后，文本向左移动了大约 5px，然后很快又回到了原来的位置。这仅发生在 IE 中；所有其他主要浏览器都表现正常。

关于它为什么会发生以及如何解决它的任何想法？我特别对修复 IE7 感兴趣。

谢谢。

（PS，为了避免 ClearType 故障，我删除了 filter 属性。）

HTML

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

CSS

div#logomarca{     
position:absolute;
left:50%;
top:0%;
margin-top:-83px;
margin-left:-83px;
width:160px;
height:45px;
    }
p#spec{position:absolute; }

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);
                });
            });
        });
 });
4

3 回答 3

1

如果您可以发布一个最小化的工作示例，这样我们就可以查看代码，这将有所帮助。

我最好的猜测是，您需要用块级元素（div或p）包装您的元素，并为该元素提供 ' position: relative;' 以便 IE 运行。

于 2009-02-12T21:27:44.140 回答
0

将边距更改为填充，看看是否有帮助。我最近遇到了一个非常相似的问题，并且解决了它。

于 2009-05-19T20:15:33.927 回答
0

尝试包装在具有固定尺寸的 div 中。

于 2009-02-12T21:25:01.213 回答