TweenLite 没有动画答案

【问题标题】：TweenLite does not animateTweenLite 没有动画
【发布时间】：2013-12-23 02:03:51
【问题描述】：

我正在尝试使用 GreenSocks TweenLite for Javascript 制作一个简单的上边距动画。我已经多次使用该库，但由于某种原因，这次它无法正常工作。注意：“onComplete”正在触发，但无论我使用什么元素，我都无法为 HTML 元素上的任何 CSS 属性设置动画。

HTML

<div id="GS_PipelineHeadline h2"></div>

JAVASCRIPT

TweenLite.to("#GS_PipelineHeadline h2", 0.5, 
{ 
    "margin-top": 0, 
    ease: "Back.easeOut", 
    onComplete: function () 
    { 
        console.log("Crap"); 
    } 
});

这是我创建的一个真正快速的 JSFiddle，其中包括所有 CSS、JS 和 HTML。 http://jsfiddle.net/mBPug/

如果有人有任何想法，我将不胜感激！

【问题讨论】：

如果您制作了一个 jsfiddle 来演示您遇到的问题，这可能会有所帮助。
好电话。我刚刚更新了我的帖子。

标签： javascript html css gsap

【解决方案1】：

一些事情：

将CSS plugin 添加到您的小提琴中
"margin-top" 不会做太多，改用top

TweenLite.to("#GS_PipelineHeadline", 0.5, {
    top: 0,
    ease: Back.easeOut,
    onComplete: function () {
        console.log("Crap");
    }
});

http://jsfiddle.net/mBPug/4/

【讨论】：

不，这达不到我想要的效果。我想要做的是揭示 h2 和 h3。我在 JS fiddle 中调整了一些东西来展示我想要完成的事情。如果我使用 JQuery animate，它可以工作。如果唯一的问题是 CSS 插件，我现在可以让它工作。我会试一试。
因为我的回答是基于你原来的问题，我相信这已经解决了。但是，如果您仍然对动画本身有问题，您应该提出另一个问题。
嘿 Tim- 看起来它只是 CSS 插件。我以前从来没有把它包括在内，我也没有遇到过问题。我正在为一个遗留站点创建一些东西，所以我试图将插件和新 JS 文件的数量保持在最低限度。但是，当我将它添加到网站时，它会立即弹出并开始工作。感谢您的帮助。