Javascript Raphael动画递归部分不访问更新的全局变量

我有两个动画的同一个圆圈只是变得大，然后小。这将重复，直到计时器用完。这很有效。它们是递归定义的，有点超出我的能力范围。问题是让它在设置动画时更改速度。我删除了不相关的代码，包括计时器，并将界面简化为三个按钮：

1） 开始/停止

2） 加速

3） 减速

它用于更改内部定义的函数，但不用于更改外部定义的函数。我不明白为什么。如蒙协助，将不胜感激。请注意我的评论，它解决了这个问题。我对计算机科学原理的理解并不令人惊讶。我尝试使用Chrome的inspector查看堆栈，但什么都看不到，也不知道我在做什么

var IN_DURATION = 3000;   
var OUT_DURATION = 5000;

var anim_inhale = Raphael.animation({
    transform: "S " + 2.2 + " " + 2.2 + "  T +"+(-320*2.2)+" "+(-240*2.2),
    fill: "#0f0"
}, IN_DURATION , "linear", function () {

    breath_circle.animate(Raphael.animation({
        transform: "",
        fill: "#00f"
    }, OUT_DURATION , "linear", function () {

        breath_circle.animate(anim_inhale);

    }));

});
breath_circle.animate(anim_inhale);

---

我提供了一个可行的JSFIDLE

我朋友给我看，他立即解决了。他所做的只是添加

console.log（anim_吸气）然后查看Chrome Inspector查看，然后继续添加代码
anim\u吸气.ms=in\u持续时间哪个修复了它。更新的JSFIDLE。因此，这解决了短期问题，但我仍然想了解为什么在未来。