Hi,
We created a small game, where we tween a very long image (18000px) on the canvas.
It has good performance on Chrome with a strong pc.
But the tween is vey laggy on standard laptop or Firefox / IE.
And I think this is relevant snippet:
function init() {
canvas = document.getElementById("bg").getContext("2d");
img = new Image();
img.xpos = 0;
img.ypos = 0;
img.src = "img/bg.jpg";
img.onload = function() {
animate();
}
$('#trigger').click(function() {
TweenMax.to(img, 60, {xpos:-17807, ypos:0, force3D:true, ease:Linear.easeNone});
TweenMax.to($('#egg_container'), 60, {x:-17807, force3D:true, ease:Linear.easeNone});
TweenLite.ticker.addEventListener("tick", animate);
});
}
function animate() {
canvas.drawImage(img, img.xpos, img.ypos);
}
init()
We do something wrong?
How can be the tween animation smooth on everywhere.
We have BusinessGreen plan, please help!
Best regards,
Ferenc Krix