PIE.htc和jQuery动画冲突?

PIE.htc和jQuery动画冲突?,jquery,css,jquery-ui,css3pie,Jquery,Css,Jquery Ui,Css3pie,我有一系列的子弹将陆续出现。我在子弹的动画中使用jQuery和jQuery UI。顶部的项目符号需要有圆角,我正在使用CSS和PIE.htc来完成。这在所有非IE浏览器和IE8中都非常有效,但在IE7中,第一个项目符号的背景约为80%变窄,约为95%变短(或者可能非常偏离左上角) 有趣的是,如果您调整broswer窗口的大小,背景会捕捉到适当的位置(不是项目符号在固定宽度的容器中,所以我不会在这里调整项目符号的大小)。如果我在CSS中注释掉PIE.htc行,项目符号会正确显示,但我需要圆角。看

我有一系列的子弹将陆续出现。我在子弹的动画中使用jQuery和jQuery UI。顶部的项目符号需要有圆角,我正在使用CSS和PIE.htc来完成。这在所有非IE浏览器和IE8中都非常有效,但在IE7中,第一个项目符号的背景约为80%变窄,约为95%变短(或者可能非常偏离左上角)

有趣的是,如果您调整broswer窗口的大小,背景会捕捉到适当的位置(不是项目符号在固定宽度的容器中,所以我不会在这里调整项目符号的大小)。如果我在CSS中注释掉PIE.htc行,项目符号会正确显示,但我需要圆角。看

有关守则如下:

JS

$([appripratebullet]).addClass('currentBullet').fadeIn('slow').prev().removeClass('currentBullet', 'slow');
.bullet
{
 display:none;
 color:#6e6e6e;
 min-height:40px;
 font-size:2.5em;
 line-height:1.5em;
 font-weight:normal;
 position:relative;
 padding:25px 20px;
 margin-top:1px;
 background:#eeeeee;
 border-bottom:1px solid #fff;
}
.bullet.first{
 margin-top:0;
 -moz-border-radius:8px 8px 0 0;
 -webkit-border-radius:8px 8px 0 0;
 border-radius:8px 8px 0 0;
 behavior: url(/Content/PIE.htc);
 }
.bullet.currentBullet{
 background:#d98452;
 color:#fff;
 }
CSS

$([appripratebullet]).addClass('currentBullet').fadeIn('slow').prev().removeClass('currentBullet', 'slow');
.bullet
{
 display:none;
 color:#6e6e6e;
 min-height:40px;
 font-size:2.5em;
 line-height:1.5em;
 font-weight:normal;
 position:relative;
 padding:25px 20px;
 margin-top:1px;
 background:#eeeeee;
 border-bottom:1px solid #fff;
}
.bullet.first{
 margin-top:0;
 -moz-border-radius:8px 8px 0 0;
 -webkit-border-radius:8px 8px 0 0;
 border-radius:8px 8px 0 0;
 behavior: url(/Content/PIE.htc);
 }
.bullet.currentBullet{
 background:#d98452;
 color:#fff;
 }


使用这个jquery插件可以在所有浏览器中获得圆角。无角图像,使用嵌套dv绘制边框。它的灵活性和易于使用。它还增加了对本机边界半径的支持,因此它只在不支持边界半径的浏览器上执行

尝试添加回调以在效果后调整大小,这将导致元素正确地重新绘制

$([appripratebullet]).addClass('currentBullet')
                     .fadeIn('slow', 
                             function() {       
                                 if ($.browser.msie) {
                                     $(this).each(function() { $(this).resize(); }); 
                                 }
                             });

我为那些面对这个问题而不能用这些答案解决的人提供这个答案,尽管这个问题已经很老了。即使jquery.corner.js很好,但它不能用于输入元素

动画完成后使用此简单方法可以使pie.htc变得完美:

function fixButton() {
    if ((navigator.userAgent.toLowerCase().indexOf("msie") != -1) && document.all)
        $("body").height("99.9%"); setTimeout(function () { $("body").height("100%"); }, 0);
}

啊,htc设备!我更愿意放弃IE支持或委托给不同的开发人员。