Анимация в KineticJS

Question

У меня есть круг, добавленный к слою. В верхней части слоя я добавил текст. Я хотел бы запустить анимацию, когда мышь находится над кругом, но когда мышь достигает текста, вызывается функция обратного вызова mouseout. Как я могу это предотвратить?

var circle = new Kinetic.Circle({ 
    x: j * xcenterstep + xshift, 
    y: i * ycenterstep + yshift, 
    radius: t_radius, 
    fill: t_fill, 
    stroke: t_stroke, 
    strokeWidth: t_stroke_w, 
    strokeOpacity: 0.1, 
    opacity: 0.3 + t_number * 0.05,     
}); 
if (t_number) { 
    circle.tw; 
    circle.on("mouseover", function() {      
     this.tw = new Kinetic.Tween({ 
      node: this, 
      duration: 0.3, 
      strokeWidth: 6 
     }); 
     this.tw.play(); 
    }); 
    circle.on("mouseout", function() { 
     this.tw.reverse(); 
    }); 
} 

// Adding the text 
var radiusText = new Kinetic.Text({ 
    x : circle.getX(), 
    y : circle.getY(), 
    text : t_number, 
    fontSize : radius,     
    fill : '#fff', 
    fontStyle: 'bold', 
    align : 'center' 
}); 
radiusText.setOffset({ 
    x : radiusText.getWidth()/2,  
    y : radiusText.getHeight()/2 
}); 

bgLayer.add(circle); 
bgLayer.add(radiusText); 

Answer 1

Я думаю, что лучше использовать событие mouseenter. Вы можете отключить события текста, чтобы исключить mouseout из круга.

radiusText.listening(false) 

Answer 2

Просмотр кода, вы пропускали } закрыть if (t_number) {. Я не уверен, что он должен был включать события mouseover и mouseout, но это могло привести к тому, что ваш код будет реагировать иначе, чем вы ожидаете.