问题标签 [gsap]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
4767 浏览

javascript - 补间 css 颜色属性,最好使用 tweenlite javascript

我有一个按钮可以反转我网站上的颜色。它利用一个名为 rgb color 的插件 - http://www.phpied.com/rgb-color-parser-in-javascript/来获取所有 dom 元素的颜色值,并将它们反转。我正在使用以下代码执行此操作:

我想做的不仅仅是翻转颜色,补间它。我很想试试 greensock 补间引擎,因为据说它比 jquery 快 20 倍,但如果必须,我可以使用不同的方法。他们的补间引擎记录在这里:

http://www.greensock.com/get-started-js/#css

所以据说,我应该能够拨打这样的电话:

但这不起作用(没有抛出错误),所以我不确定我做错了什么。任何人都对如何使其工作有任何想法,或者对所有这些颜色属性进行补间的最快方法是什么?

0 投票
1 回答
681 浏览

javascript - 嵌套时间线中的问题:GreenSock for javascript

我正在嵌套时间线。

代码就像:

当我做:

我的动画将从第一个开始。但问题是 obj2 不透明度不会重置为 0。

我无法理解为什么会出现这个问题?

任何解决方案将不胜感激..

0 投票
1 回答
4305 浏览

actionscript-3 - TweenMax/TweenLite、onComplete 函数、onCompleteParams 和垃圾回收

当我创建一个补间时,有时我会做这样的事情:

TweenMax.to(greyCircle, SELECT_TRANSITION_TIME, { alpha:0, onComplete: function ():void
{ isSelectedTransitioning = false; greyCircle.visible = false; } });

有时我使用 onCompleteParams 传入参数。

我的问题是这样的:

现在补间对象(由静态函数 TweenMax.to 创建)具有对这个匿名函数的引用,并且可能还有 onCompleteParams 中的一些对象,现在在垃圾收集期间将不再收集函数和参数对象,即使补间可能已经完成?

如果传入的函数不是匿名的,对 GC 有什么影响吗?

寻找内存泄漏...

0 投票
2 回答
5276 浏览

jquery - 使用 greensock tweenlite 补间 svg 属性(js 版本)

我想使用greensock的 js 动画平台来补间 svg 圆的半径,但它似乎不起作用,而且我在文档中没有看到任何关于补间属性的内容,只有 css 属性。这可能吗?我基本上有这个:

我正在尝试这样做:

我试过用 jquery 做这个,它也没有工作,但我会接受任何一种方法。

0 投票
1 回答
283 浏览

actionscript-3 - 补间到 AS3 中的其他移动对象

是否可以将一个物体移向另一个可能正在移动的物体?

据我所知,我只能将 x,y 坐标作为移动参数(?)

0 投票
1 回答
13559 浏览

javascript - 有没有一种简单的方法来重置 TimelineMax JavaScript 对象?

我在重新初始化 TimelineMax 序列时遇到问题。调整窗口大小时,我需要将所有补间恢复为默认样式并根据新的窗口大小重新初始化它们。有没有一种简单的方法可以有效地破坏时间线并重新开始,而无需手动重置所有 CSS 属性?

0 投票
2 回答
671 浏览

actionscript-3 - Separating movement tween and alpha tween using GreenSock

I'm using GreenSock's TweenMax in AS3, Flash AIR 3.2 for iOS. I'm trying to get a string of text to start fading using the autoAlpha plugin at a certain point (such as after it reaches the middle of the tween) during the movement tween, and not from start to finish. At the moment it is tweening both the movement and alpha from the start position to finish. Is this possible to do?

EDIT: This is the current code with the functions and syntax fixed, but it does not work for some reason. There is still a movement tween, but the alpha is not tweening anymore. The logic seems correct though. (alpha now replaces autoAlpha because it works over the latter).

EDIT: totalProgress() has been replaced with progress() and the alpha tweens again – but there's another problem with the alpha tween. I've traced out both textOne.alpha and _tween.progress() to debug. Either it's because of the single-threaded nature of AS3, it is messing up the call logic at the end of each loop... because there is a delayed end to the alpha tween, the REPEAT call cannot set the alpha to 1 in time, before the progress tween starts. Or it's something in the logic which is wrong. I tried setting the (alpha) tween time of TextOne to 6, but it still messes it up.

Actually, I'm not too sure what's going on after thinking about it a bit more. It makes NO logical sense. The first alpha tween is fine, then it messes up on repeat and repeats the alpha tween (but at the wrong progress() position) a few times, then stays at 0 forever. Here's a snapshot of the traces:

ALPHA: 0.0078125
PROGRESS: 0.9979285714285714
MIDDLE: true
...
ALPHA: 0
PROGRESS: 0.9992857142857144
MIDDLE: true

ALPHA: 0
PROGRESS: 0.00028571428571438115
MIDDLE: true

ALPHA: 0
PROGRESS: 0.000714285714285826
MIDDLE: false

ALPHA: 0.99609375
PROGRESS: 0.0015714285714287155
MIDDLE: false
...
ALPHA: 0.1015625
PROGRESS: 0.4504285714285715
MIDDLE: false

ALPHA: 0.09765625
PROGRESS: 0.4515714285714285
MIDDLE: false
...
ALPHA: 0.00390625
PROGRESS: 0.4992142857142858
MIDDLE: false

ALPHA: 0
PROGRESS: 0.5003571428571431
MIDDLE: false

0 投票
2 回答
4038 浏览

actionscript-3 - 使用 GreenSock 补间 alpha

尝试graphics使用 GreenSock 对 AS3 中对象的 alpha 进行补间,但这些功能不起作用。尝试在 2 秒内从 alpha 0 补间到 0.7。该fromTo();方法也不起作用。我不想,但我是否必须改为使用增量 for 循环来执行此操作?——因为这不会让我控制补间的时间。



编辑:我通过将上面的 TweenMax 函数替换为以下内容,修复了从 alpha 0 到 0.7 的渐变:

但是,当它与程序的其余部分一起运行时,alpha tween 会出现问题。补间“闪烁”并立即变为 0.7(它看起来像是从 0 到 0.7 的“跳跃”),只要你能看到它。该问题已被隔离到在overlayBox();程序概述之后调用的函数:使用加载器加载图像。在装载机内部,有一个myTimer.start();. 这用于在加载图像后运行程序的其余部分。这overlayBox();是遵循并运行良好的第一种方法。下一个方法textAnimation();是破坏它,我不知道为什么:

0 投票
2 回答
151 浏览

javascript - 如何将鼠标的 currentTarget 传递给 timelineMax 函数

所以我正在尝试创建一个可重用的函数,我页面上的每个 .featured-image 都使用它。如果我不使用主干事件:并且我只是编写被注释掉的代码,它就可以工作。如何获得模仿注释代码的事件 imageOver 和 imageOut?

0 投票
1 回答
1993 浏览

actionscript-3 - Flash 1071 错误,需要定义关键字

尝试使用 GreenSock 在 Flash AS3、AIR 3.2 for iOS 中使其工作。我尝试将其定义为变量、函数等,但无济于事。网上一搜一无所获。

代码行出现以下错误TweenMax tween = TweenMax.to(textOne, 14, {x:xScreenPosEnd, ease:SlowMo.ease.config(1, 0), repeat:-1});

1071:语法错误:在属性 TweenMax 之后需要一个定义关键字(例如函数),而不是 tween。
1084:语法错误:在左大括号之前需要右大括号。
1084: 语法错误:在 rightparen 之前需要标识符。

编辑:错误行已替换为出现的var tween:TweenMax = TweenMax.to(textOne, 14, {x:xScreenPosEnd, ease:SlowMo.ease.config(1, 0), repeat:-1});
进一步错误是:
1120:访问未定义的属性 TweenMax。
1046:未找到类型或不是编译时常量:TweenMax。
1120:访问未定义的属性补间。
1120:未定义属性中间的访问。

我的 GreenSock 进口如下:

甚至尝试过import com.greensock.*;

编辑:添加该行import com.greensock.TweenMax;已删除错误:
1120:未定义属性 TweenMax 的访问。
1046:未找到类型或不是编译时常量:TweenMax。

其他两个错误仍然存​​在。