Something like that is working :
rect.on("mouseover", function() {
tween._addAttr("fillBlue", 0);
tween._addAttr("fillRed", 255);
tween.play();
});
Question
Is there a way to change the tween destination colour dynamically in Kinecticjs?
I've started with a rectangle and a tween with a destination colour, but I want to be able to change the destination colour dynamically. As an example, I've tried to access the Tween fillBlue property but it has no effect. This feature seemed to work in the previous KinectJS library but not 5.0. JsFiddle: http://jsfiddle.net/cmh600/7HT46/
Thanks
var stage = new Kinetic.Stage({
container: 'container',
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: 20,
y: 20,
width: 100,
height: 50,
fillRed: 0,
fillGreen: 128,
fillBlue: 0,
stroke: 'black',
strokeWidth: 2,
});
layer.add(rect);
stage.add(layer);
var tween = new Kinetic.Tween({
node: rect,
duration: 2,
opacity: 1,
easing: Kinetic.Easings.Linear,
fillRed: 0,
fillGreen: 0,
fillBlue: 255
});
rect.on("mouseover", function() {
tween.fillBlue = 0;
tween.play();
});
La solution
Something like that is working :
rect.on("mouseover", function() {
tween._addAttr("fillBlue", 0);
tween._addAttr("fillRed", 255);
tween.play();
});