无需深入了解插件,只需css3animate
使用当前( 计算的 )所需道具的值来重新使用您的方法,并将持续时间设置为0(在插件中为1,因为您使用!speed
来使用默认值。)
所以在示例中使用
var $animated = $('div');
$animated.css3animate({"height": $animated.css('height'), "width": $animated.css('width')}, 1);
会成功的
当然,您应该针对正在使用的当前属性自动执行此操作。如果在启动动画时使用计时器,而在有人使用stop方法时使用计时器,则还可以模拟暂停/继续功能。
您可以将cssObject
传递给动画的内容存储到data
元素的,并在它们的停止循环上存储它们以获取当前值。
因此,在您的animation
方法中,您可以$obj.data('animationCss', cssObject);
并且在stop
方法中
stop : function( clearQueue,jumpToEnd ){
return this.each(function(){
var $that = $(this);
var currentCss = {};
var animationCss = $that.data('animationCss');
for (var prop in animationCss)
currentCss[prop] = $that.css(prop);
if (jumpToEnd)
{
animation($that,currentCss,1, function(){animation($that,animationCss,1)});
}
else
{
animation($that,currentCss,1);
}
console.log("stop was called");
});
}