gpt4 book ai didi

jquery - 新的 FireFox BorderRadius/Rotate 动画错误?

转载 作者:太空宇宙 更新时间:2023-11-04 05:00:47 24 4
gpt4 key购买 nike

我最近在插件构建期间升级到了 Firefox 14.0.1。该插件同时为 border-radius、border-width、border-color 以及各种其他属性设置动画。其他浏览器或以前版本的 FireFox 没有任何问题,但更新后我注意到在旋转动画时边界半径动画期间出现严重的碎片/伪影。以下是我用于旋转的代码:

/* ROTATE */
function animate_rotate(degree,Speed,AnimateDegree){
/* FACTOR DEGREE */if(degree<AnimateDegree){
++degree; Screens.current_rotate=degree;
}else if(degree>AnimateDegree){
--degree; Screens.current_rotate=degree;
};
/* APPLY THE NEW ROTATION ANGLE TO IE>9 */
if(!ievers<=8){
$ScreensLightbox.css({'-moz-transform':'translateX(0) rotate('+degree+'deg)','-moz-transform-origin':''+Screens.LBRotateHandle[0]+'% '+Screens.LBRotateHandle[1]+'%','-webkit-transform':'translateX(0) rotate('+degree+'deg)','-webkit-transform-origin':''+Screens.LBRotateHandle[0]+'% '+Screens.LBRotateHandle[1]+'%',/* Opera */'-o-transform':'translateX(0) rotate('+degree+'deg)','-o-transform-origin':''+Screens.LBRotateHandle[0]+'% '+Screens.LBRotateHandle[1]+'%',/* IE>=9 */'-ms-transform':'rotate('+degree+'deg)','-ms-transform-origin':''+Screens.LBRotateHandle[0]+'% '+Screens.LBRotateHandle[1]+'%'});
};
/* PUSH INSTANCE TIMER-ON ARRAY */
Screens.Rotate_Timer.push(setTimeout(function({animate_rotate(degree,Speed,AnimateDegree)},Speed/63));
};

下面是动画边框半径的函数:

/* BORDER RADIUS */
function animate_border_radius(SetBorderRadius,AnimateBorderRadius,Speed,Effect){
$ScreensLightbox.css({'border-top-left-radius':SetBorderRadius,'border-top-right-radius':SetBorderRadius,'border-bottom-left-radius':SetBorderRadius,'border-bottom-right-radius':SetBorderRadius})
.animate({borderTopLeftRadius:AnimateBorderRadius, borderTopRightRadius:AnimateBorderRadius,borderBottomLeftRadius:AnimateBorderRadius,borderBottomRightRadius:AnimateBorderRadius,WebkitBorderTopLeftRadius:AnimateBorderRadius,WebkitBorderTopRightRadius:AnimateBorderRadius,WebkitBorderBottomLeftRadius:AnimateBorderRadius,WebkitBorderBottomRightRadius:AnimateBorderRadius,MozBorderRadius:AnimateBorderRadius},
{duration:Speed,queue:false,specialEasing:{borderTopLeftRadius:Effect,borderTopRightRadius:Effect,borderBottomLeftRadius:Effect,borderBottomRightRadius:Effect,WebkitBorderTopLeftRadius:Effect,WebkitBorderTopRightRadius:Effect,WebkitBorderBottomLeftRadius:Effect,WebkitBorderBottomRightRadius:Effect,MozBorderRadius:Effect}});
};

有人在尝试在最新的 Firefox 中同时设置旋转和边框半径动画时遇到类似问题吗?谢谢!

最佳答案

我们遇到了一个非常相似的问题。我们有一些图像通过动画功能淡入视野。在 14.0.1 版本之前,在包括 FF 在内的所有浏览器中都能很好地工作。

// image animation
$("#imgDisplay img").each(function(index) {
var tm = 800 * index;
var imgTop = $(this).css('margin-top');
arr = imgTop.split('px');
var imgTopStart = (arr[0]*1)-50;
$(this).css({
"opacity": "0",
"margin-top": imgTopStart+"px"
}).show();

$(this).delay(tm).animate({
opacity: 1,
"margin-top": imgTop
}, 1500, function() {
// Animation complete.
});
});

关于jquery - 新的 FireFox BorderRadius/Rotate 动画错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11568852/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com