我在为图像对象设置动画时遇到此问题。这就是我制作形象的方式:
var paddleUpgradeImage = new Image();
paddleUpgradeImage.src = "images/expand.gif";
function makeEaseOut(delta) {
return function(progress) {
return 1 - delta(1 - progress);
};
}
function bounce(progress) {
for(var a = 0, b = 1, result; 1; a += b, b /= 2) {
if (progress >= (7 - 4 * a) / 11) {
return -Math.pow((11 - 6 * a - 11 * progress) / 4, 2) + Math.pow(b, 2)
}
}
}
function quad(progress) {
return Math.pow(progress, 2)
}
function drawMovement() {
paddleUpgradeImage.animate({
delay: 20,
duration: 3000,
delta: makeEaseOut(bounce),
step: function(delta) {
//img.style.top = height*delta + 'px';
upgradesY[0] = 400*delta;
}
});
paddleUpgradeImage.animate({
delay: 20,
duration: 3000,
delta: makeEaseOut(quad),
step: function(delta) {
upgradesX[0] = 200*delta;
//img.style.left = width*delta + "px";
}
});
}
UpgradesX和upgradesY是保存图片位置的数组。
它给了我这个错误:
Uncaught TypeError: Object #<HTMLImageElement> has no method 'animate'
如何解决这个问题并使我的形象动起来?
最佳答案
只需调用$
(如果没有冲突模式,则调用jQuery
),将DOM元素作为参数传递。
var x = new Image()
x.src = 'y.gif'
$(x).animate({ /* ... */ })
关于javascript - 如何用Java动画制作图像对象?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/19662632/