mouseleave上的补间变量无法正常工作

I am attempting to tween a variable down to zero on mouseleave, but nothing happens when the mouse leaves the container.

我试图在mouseleave上将变量补间降至零,但是当鼠标离开容器时没有任何反应。

I have tried various things. What am I doing incorrectly?

我尝试过各种各样的东西。我做错了什么?

Here is the code:

这是代码:

 function ondocumentMouseLeave ( event ){


            new TWEEN.Tween( mouseY )
            .to ( 0 , 500 )
            .easing( TWEEN.Easing.Linear.None)
            .start();


            new TWEEN.Tween( mouseX )
            .to ( 0 , 500)
            .easing( TWEEN.Easing.Linear.None)
            .start();
            }

Here is the jsfiddle:

这是jsfiddle:

https://jsfiddle.net/cxp8rex2/16/

I apologize if this is a simple question, I am a bit new to this.

如果这是一个简单的问题我道歉,我对此有点新意。

1 个解决方案

#1

You need to use an Object and tween its properties like:

您需要使用Object并补间其属性,如:

function ondocumentMouseLeave ( event ) {

  var mouse = {x: mouseX, y: mouseY};

  new TWEEN.Tween( mouse ).to ( { x: 500, y: 500 }, 1000 )
    .easing( TWEEN.Easing.Linear.None )
    .onUpdate(function() {
        mouseX = this.x;
        mouseY = this.y;
    })
    .start();

}

have a look on tween.js user guide.

看看tween.js用户指南。

#1